Question

我是Hooks的新手，遇到过一些案件，这些案件使我不得不追赶我的尾巴。

希望有人可以解释或提供对我有意义的解决方案：

在组件安装时仅加载一次方法会造成混淆。我尝试过这种方法，它可以工作，但不了解。有人可以向我解释一下吗？

const useMountEffect = fun => useEffect(fun, [])

useMountEffect(() => {
  if (!isEdit) handleAddRow()
})

const handleAddRow = () => {
  let appendArr = [...listArr, '']
  setListArr(appendArr)
}

下面的主题： How to call loading function with React useEffect only once

我尝试只使用没有依赖项的useEffect，而eslint不喜欢这种方式，因此他们建议添加一个似乎有点hacky的跳过下一行：

// eslint-disable-next-line

Answer 1

useEffect()接受2个参数-您的函数和依赖项。依赖关系部分告诉它何时运行函数-如果依赖关系没有更改，它将不再运行。如果依赖项确实更新，它将再次运行您的功能。

Answer 2

如果我是正确的，那么您需要类似于componentDidMount生命周期方法的方法。做到这一点的方法是

function MyComponent(props){
    useEffect(()=>{
        // do stuff here...
    }, []) // <-- empty dependency array
    return <div></div>
}

要了解正在发生的事情，您需要了解useEffect挂钩如何工作。使用无任何依赖关系的useEffect挂钩会在每次某些状态或道具更改并导致重新渲染时触发效果。但是如果我们将一个空数组作为依赖项传递，则其效果将不依赖于其他任何东西，因此它将仅在组件安装时触发。

反应只在加载时调用一次方法

2 个答案: