如何使用useEffect
钩子(或任何其他钩子)进行复制componentWillUnmount
?
在传统的类组件中,我会做这样的事情:
class Effect extends React.PureComponent {
componentDidMount() { console.log("MOUNT", this.props); }
componentWillUnmount() { console.log("UNMOUNT", this.props); }
render() { return null; }
}
用useEffect
钩子:
function Effect(props) {
React.useEffect(() => {
console.log("MOUNT", props);
return () => console.log("UNMOUNT", props)
}, []);
return null;
}
(完整示例:https ://codesandbox.io/s/2oo7zqzx1n )
这不起作用,因为返回的“清理”函数会useEffect
捕获安装期间的道具,而不是卸载期间道具的状态。
如何在每次道具更改时不运行函数体(或清理)的useEffect
情况下获得最新版本的道具?
一个类似的问题没有解决访问最新道具的部分。
反应文档状态:
如果你想运行一个效果并且只清理一次(在挂载和卸载时),你可以传递一个空数组([])作为第二个参数。这告诉 React 你的效果不依赖于任何来自 props 或 state 的值,所以它永远不需要重新运行。
但是在这种情况下,我依赖于道具......但仅限于清理部分......