Reactjs 反应|和#xA0；React Hook useEffect缺少依赖项

当第一次使用react钩子打开页面时，我只想在第一次打开时更新存储中的值一次。为此，我将useEffect“[]”的第二个参数设为空列表。没有任何东西阻止它工作，但我从ESLint规则中得到一个警告：React Hook useEffect缺少依赖项：“changeCount”。包括它或删除依赖项数组react hooks/deps。如何删除此警告

const App = ({UserStore:{setCount, count}}) => {
  const changeCount = () => {
    setCount();
  }

  useEffect(() => {
    changeCount();
  },[])

  return (
  ..
  )}

---

移动

changecont

内部

useffect

const App = ({UserStore:{setCount, count}}) => {
  useEffect(() => {
    const changeCount = () => {
      setCount();
    }

    changeCount();
  },[])

  return (
  ..
  )
}

太长，读不下去了 修复eslint配置“react hooks/deps”

答复 这是带有hook的eslint错误，那么像这样修复eslint配置怎么样

{
“插件”：[
// ...
“反应挂钩”
],
“规则”：{
// ...
“react hooks/rules of hooks”：“error”，//检查hooks的规则
“react hooks/deps”：“off”//检查效果依赖项
}
}

但它可能会使钩子的操作错误，因此另一种方法是使用

/*eslint disable*/

参考文献

---

使用此语法在依赖项数组之前删除此

eslint

警告，如下所示：

const App = ({UserStore:{setCount, count}}) => {
const changeCount = () => {
    setCount();
}

useEffect(() => {
    changeCount();
    // eslint-disable-next-line
},[])

return (
  ..
)}

---

changecont

是一个不是

setState

或hook的函数。由于您在

useffect

React中使用了它，因此React将向您发出警告。因为它警告你阅读的原因

---

上面的一些答案建议您禁用该检查，我建议只对您正在处理的一个进行diable。但是，通常您不需要担心警告。

创建自定义挂钩

export const useMountEffect = handler => useEffect(handler, []);

像吃一样吃

useMountEffect(() => {
  changeCount();
});

---

你不仅可以摆脱这个警告。。。但更清楚的是，这种效果只会在mount上执行。

onMount

…

哦，这是解决它的一种方法，很好：）您永远不应该禁用所有警告。指定要禁用的警告，最好也在代码中留下注释，特别是对于文档声称触发它的代码总是错误的警告…我认为甚至建议禁用整个规则都是一个糟糕的主意。我认为：）但这只是解决问题的一种方法