当组件被卸载但可以访问当前props时，我遇到了清理 useEffect 的需要。就像 componentWillUnmount 可以通过获取 this.props.whatever 来做
这是一个小例子：单击“设置计数”按钮 5 次，然后查看您的控制台。您将在组件 B 的 console.log 中看到 0，无论“计数”为 5 https://codesandbox.io/embed/vibrant-feather-v9f6o
如何实现在 useEffect 清理函数中获取当前props的行为（在我的例子中为 5）？
更新：将 计数传递给 useEffect 的依赖项将无济于事，因为：
从另一个问题中引用了这个问题，因此将对其进行一些挖掘，因为没有公认的答案。
你想要的行为永远不会发生，因为 B 永远不会以 5 的计数值呈现，当计数为 5 时，组件 A 不会呈现组件 B，因为它将呈现卸载而不是B，呈现的最后一个值 B 将是 4。
如果您希望 B 在卸载时记录它用于计数的最后一个值，您可以执行以下操作：
请注意，在所有组件都渲染完后执行效果
const useIsMounted = () => {
const isMounted = React.useRef(false);
React.useEffect(() => {
isMounted.current = true;
return () => (isMounted.current = false);
}, []);
return isMounted;
};
const B = ({ count }) => {
const mounted = useIsMounted();
React.useEffect(() => {
// eslint-disable-next-line react-hooks/exhaustive-deps
return () => !mounted.current && console.log(count);
}, [count, mounted]);
return <div>{count}</div>;
};
const A = () => {
const [count, setCount] = React.useState(0);
const handleClick = React.useCallback(() => {
setCount(prevCount => prevCount + 1);
}, []);
if (count === 5) {
//B will never be rendered with 5
return <div>Unmounted</div>;
}
return (
<React.Fragment>
<B count={count} />
<button onClick={handleClick}>Set count</button>
</React.Fragment>
);
};
ReactDOM.render(<A />, document.getElementById('root'));<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.4/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.4/umd/react-dom.production.min.js"></script>
<div id="root"></div>你需要跟踪count在useEffect：
import React, { useEffect } from "react";
const B = ({ count }) => {
useEffect(() => {
return () => console.log(count);
}, [count]);
return <div>{count}</div>;
};
export default B;
由于您将空数组作为依赖项列表传递给useEffect，您的效果函数仅在第一次注册。那时，count 的值为 0。这就是附加到 useEffect 内部函数的 count 值。如果您想获得最新的计数值，您需要在每次渲染时运行 useEffect。删除空数组依赖项。
useEffect(() => {
return () => console.log(count);
})
或使用 count 作为依赖项。这样，每次计数更改时都会重新创建您的效果函数，并且还会创建一个新的清理函数，该函数可以访问最新的计数值。
useEffect(() => {
return () => console.log(count);
}, [count])