React useEffect，僅在狀態更改后調用

Question

我們使用 react recollect 作為狀態管理工具。 在下面的這個 useEffect 中，只有當數組依賴中的狀態發生變化時，我才想調用 appStore.getSettingsHistory() 函數。 但是根據下面的代碼，當組件掛載時，我們最初會看到 5 個調用（與數組中的一樣多），然后隨着這些狀態的變化而進行其他調用。 我怎樣才能實現，在開始時只調用這個 api (appStore.getSettingsHistory()) 一次，然后隨着這些狀態的變化。

useEffect(() => {
  appStore.getSettingsHistory();
}, [store.brandPrefs, store.formularies, store.selectedFormularyName, store.settings.showMaskToPatient, store.settings.sendMessageOnComplete])

Answer 1

我想您可以創建另一個狀態變量並檢查您的組件是否首先呈現，在這種情況下調用 API 一次，在其他情況下根據依賴數組調用它。 像這樣的東西-

const [mounted, setMount] = useState(false);
if(!mounted){
    useEffect(() => {
    appStore.getSettingsHistory();
    setMount(true);
    },[])
}
else{
    useEffect(() => {
    appStore.getSettingsHistory();
    }, [store.brandPrefs, store.formularies, store.selectedFormularyName, 
    store.settings.showMaskToPatient,  store.settings.sendMessageOnComplete])
}