use effect 仅在状态变为 false 时运行

Question

我使用 react 并且我有一个名为 isModalOpen 的状态。

const [isModalOpen, setIsModalOpen] = useState<boolean>(false);

我有一个 useEffect 函数

useEffect(() => {},[]);

我希望每次当我的 isModalOpen 变为false（仅 false）时我的使用效果都会运行

我写

useEffect(()=>{},[!isModalOpen])

但是每次 isModalOpen 更改时都会运行此方法（真到假或假到真）

Answer 1

useEffect 的依赖数组旨在通知 useEffect 在值发生更改时运行。因此，无论您是通过 isModalOpen 还是 !isModalOpen，它都是一回事，因为它只是检查值是否已更改，即 false 为 true 或 true 为 false。

有条件地执行某事的方法是在回调函数中添加一个条件

useEffect(()=>{
    if(!isModalOpen) {
        // write your code here
    }

},[isModalOpen]);

但是，如果您想在某个时候访问 useEffect 中的旧值和新值，则可以实现React Hook FAQs 中usePrevious提到的钩子