在帶有useState鉤子的 React 功能組件中,我不知道如何運行多個異步操作而不會對最終結果產生沖突。如果初始狀態是一個對象并且每個異步操作都對給定的鍵執行更改,則可以使用擴展運算符來設置新狀態。例子:const [oldState, setNewState] = React.useState({ /* something */ });const asyncOperation = async () => { await somethingAsync(); setNewState({ ...oldState, key: 'newValue', });};當更多這些操作同時運行時,問題就出現了:oldState使用的期間setNewState可能會在另一個異步函數結束時改變,但是當最后一個異步操作執行他的時候,狀態的一些更新可能會丟失,setNewState因為引用oldState可以指向到舊版本的變量。這是一個演示:嘗試單擊一行中的每個按鈕,最后,其中一些(可能)會導致仍在加載。如何在不留下反應鉤子的情況下避免這個問題?
useState 與 React 中的異步操作沖突
元芳怎么了
2021-10-29 16:28:14
