ESLint：收到错误“React Hook useEffect 缺少依赖项”

问题描述

我目前正在使用 Recoil 和 React 制作 TodoList 应用程序，但出现错误：

matches()

我相信这会阻止应用程序构建。它在开发模式下工作。

请帮我解决这个问题！

这是相关文件：

tidyverse

解决方法

这是 React 回馈的警告。通过这个 React 希望我们使用 setTodoList 和 todoList 是第二个参数数组中的依赖项。

  useEffect(() => {
    if (priority) {
      setTodoList(
        todoList.slice().sort(function (a,b) {
          return a.priority - b.priority; // By priority
        })
      );
    } else {
      setTodoList(
        todoList.slice().sort(function (a,b) {
          return a.title.localeCompare(b.title); // By name
        })
      );
    }
    // Watches priority for sortButton,and editing,adding and deleting modes etc.
  },[priority,changing,show,removing,todoList,setTodoList]); // Added todoList and setTodoList as dependencies

但是，我们必须小心不要在组件中创建 infinite loop。因为 setTodoList() 将触发组件的重新渲染，并再次调用 useEffect()。这将继续发生。

如果发生这种情况解决方案是在 useCallback() 周围使用 setTodoList 以防止每次重新创建函数（我们可能还需要稍微格式化我们的代码）

,

此错误是由您的 eslint 规则引起的：https://reactjs.org/docs/hooks-rules.html 您可以通过添加以下内容来关闭 eslint.rc 中的规则：

{
  "rules": {
    "react-hooks/exhaustive-deps": "off"
  }
}