Question

我是新来反应钩子的人，正如我在文档中读到的那样，useEffect在组件的每次更新和首次渲染上运行（因此它是componentDidMount和componentDidUpdate的组合），但是当我获取数据时在useEffect内部，它将在状态更新时重新执行此操作，因此，如果在从服务器获取数据后设置状态值，则会创建无限循环。并且我想阻止它并且仅在componentDidMount中获取它的第一次渲染，该如何实现呢？

Answer 1

useEffect()将依赖项作为数组参数。此依赖项充当决策者，以便在依赖项的值之一发生更改时，调用useEffect。

这实际上等同于说：

shouldComponentUpdate(nextProps, nextState) {
 // If props or state changes, update the component
 if(this.props.someProp != nextProps.someProp  || this.state.someState != nextState.someState){
   return true;
 }
 return false;
}

使用useEffect（）：

useEffect(() => {
  //Do stuff here
}, [somePropValue, someStateValue]);

但是要说只能执行一次，请指定一个空的依赖项数组（对于在加载时发生一次的API调用是理想的）：

useEffect(() => {
      //Do stuff here
    }, []);

停止挂钩在组件更新时重新获取数据

1 个答案: