如何仅使用一次React useEffect调用加载函数

该useEffect阵营钩将运行在功能上传递的每一个变化。可以对其进行优化,使其仅在所需属性更改时调用。

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

class MyComponent extends React.PureComponent {

componentDidMount() {

loadDataOnlyOnce();

}

render() { ... }

}

使用钩子可能看起来像这样:

function MyComponent() {

useEffect(() => {

loadDataOnlyOnce(); // this will fire on every change :(

}, [...???]);

return (...);

}

回答:

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

function MyComponent() {

useEffect(() => {

loadDataOnlyOnce();

}, []);

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

}

以上是 如何仅使用一次React useEffect调用加载函数 的全部内容, 来源链接: utcz.com/qa/436403.html

回到顶部