useEffect React挂钩将在每次更改时运行传入的函数。可以对其进行优化,使其仅在所需属性更改时调用。

如果我想从componentDidMount调用初始化函数而不在更改时再次调用该怎么办?假设我要加载一个实体,但是加载功能不需要组件中的任何数据。我们如何使用useEffect挂钩做到这一点?

class MyComponent extends React.PureComponent {
    componentDidMount() {
        loadDataOnlyOnce();
    }
    render() { ... }
}

使用钩子(Hook)可能看起来像这样:
function MyComponent() {
    useEffect(() => {
        loadDataOnlyOnce(); // this will fire on every change :(
    }, [...???]);
    return (...);
}

最佳答案

如果只想在初始渲染后运行给useEffect的函数,则可以给它一个空数组作为第二个参数。

function MyComponent() {
  useEffect(() => {
    loadDataOnlyOnce();
  }, []);

  return <div> {/* ... */} </div>;
}

关于javascript - 如何仅使用React useEffect调用加载函数一次,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/53120972/

10-12 02:28