ESLint prefer-arrow-callback错误

Question

我的ESLint有问题

这是我的功能：

$productItem.filter(function (i, el) {
        return el.getBoundingClientRect().top < evt.clientY
    }).last()
    .after($productItemFull)

以下是ESLint告诉我的内容：

warning  Missing function expression name  func-names
error    Unexpected function expression    prefer-arrow-callback

如何解决这个错误？

Answer 1

它基本上是在Arrow function回调函数中使用filter语法。

$productItem.filter((i, el) => el.getBoundingClientRect().top < evt.clientY)
    //              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    .last()
    .after($productItemFull);

这是ESLINT documentation for prefer-arrow-callback所说的

箭头函数适用于回调，因为：

• 箭头函数中的this关键字绑定到上部范围。
• 箭头函数的表示法比函数表达式短。

并且，在以下情况下，将抛出错误

/*eslint prefer-arrow-callback: "error"*/

foo(function(a) { return a; });
foo(function() { return this.a; }.bind(this));

您的代码与第一个代码段相同。因此，错误prefer-arrow-callback由ESLint显示。

要解决错误，您可以

1. 使用Arrow function语法（如上所示）
2. 使用options和命名函数来抑制错误

   /*eslint prefer-arrow-callback: ["error", { "allowNamedFunctions": true }]*/
   
   foo(function bar() {});

Answer 2

解决“意外函数表达式。（prefer-allow-callback）”错误在eslint中在代码的开头写下这段代码：

/*eslint prefer-arrow-callback: 0*/