'错误'消息：''index'已定义但从未使用过。 （无未使用-VARS）

Question

设置了eslint和eslint-plugin-react。

当我运行ESLint时，linter为每个React组件返回no-unused-vars错误。

我假设它没有意识到我正在使用JSX或React语法。有任何想法吗？

我的代码 -

Answer 1

在您的代码块中

users.forEach((user, index) => { ... }) 
                     ^^^^^

你永远不会使用参数index，使它无用。这就是为什么ESLint抱怨 - 理所当然。

相反去吧

users.forEach((user) => { ... }) 

Answer 2

 handleSelectAll = () => {
    const { users } = this.props.users
    this.setState((prevState) => {
      const newState = { ...prevState }
      newState.selects = []
      users.forEach(user => {
        newState.selects.push(!prevState.selectedAll)
      });
      newState.selectedAll = !prevState.selectedAll
      return newState
    })
  }

“消息：'围绕箭头函数参数的预期括号。（arrow-parens）”

Answer 3

正如另一个答案已经解释的那样，no-unused-vars规则触发了linter错误，因为index参数未被使用。它可以省略：

users.forEach(user => {
  /* ... */
});

如果由于某种原因暂时没有使用参数但预计将在以后使用，或者需要正确的函数arity（这不是forEach的情况），它可以被标记为未使用（通常，underscored parameters treated as such）：

users.forEach((user, _index) => {
  /* ... */
});

Expected parentheses around arrow function argument linter错误意味着它被配置为使用arrow-parens rule在箭头函数中强制执行可选括号。可以通过禁用此规则或添加括号来更改此设置：

users.forEach((user) => {
  /* ... */
});

后一个选项可能是首选，因为强制箭头括号are more consistent。