反應：如果變量更改，則僅重新加載頁面一次

Question

我有一個變量isVisible ，它包含一個 boolean 值。 當這個變量改變時，我需要重新加載組件，但只有一次。 如果變量在某個時候再次更改，則再次運行此重新加載一次，但不是連續運行。 目前，我有這個連續運行的代碼：

useEffect(() => {
    if (isVisible) {
        window.location.reload();
    }
}, [ isVisible ]);

這怎么可能實現？ 有人能告訴我為什么這個組件會不斷地重新加載，即使我在依賴數組中添加了變量？

Answer 1

注意：重新加載整個網站以重新加載組件在 react 中不是一個好方法。 如果只需要重新加載一個組件，您可以嘗試從父組件更改其鍵。

對於這種特殊情況（如果你真的需要重新加載試試這個）

創建 state 以檢查其是否首次加載

const [isFirstLoad, setIsFirstLoad] = useState(true)
const [isVisible, setVisible] = useState(false)
useEffect(() => {
    if (!isFirstLoad) {
        window.location.reload();
    } else {
        setIsFirstLoad(false)
    }
}, [ isVisible ]);