第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

React-hook setState 未按預(yù)期工作

React-hook setState 未按預(yù)期工作

茅侃侃 2023-08-05 21:09:12
我有以下代碼:  const classes = useStyles();  const [data1, setData1] = useState([]);  const [searchedString, setSearchString] = useState("");  console.log(data1);  const fetchDataHandler = async () => {    setData1([]);    axios      .get(`http://localhost:5000/select?articul=${searchedString}`)      .then((response) => {        dataStruction(response.data);      })      .catch((err) => {        console.log(err);      });  };  const dataStruction = (data) => {    data.map((element1) => {      if (element1.secondaryArt.startsWith("30")) {        return setData1([...data1, { ...element1, level: 1 }]);      }    });  };  const onChangeSearchText = (event) => {    setSearchString(event.target.value);  };我希望每當(dāng)我調(diào)用 fetchDataHandler 時都能夠?qū)?data1 設(shè)置為空數(shù)組?,F(xiàn)在它正在工作,因為每次我調(diào)用 fetchDataHandler 時結(jié)果都會保留。我該怎么做?
查看完整描述

1 回答

?
郎朗坤

TA貢獻1921條經(jīng)驗 獲得超9個贊

問題:

在觸發(fā)新渲染之前(在函數(shù)頂部),您的異步處理程序?qū)?code>dataStruction?關(guān)閉。data1?setData1([]);async

發(fā)生這種情況是因為 React 狀態(tài)更新是批量且異步的。

簡單的解決方案:

如果您擺脫(刪除該行)setData1([]);并更改setData1([...data1, { ...element1, level: 1 }]);setData1([{ ...element1, level: 1 }]);,那么您將得到一個包含新元素的數(shù)組,而不保留“舊”元素。

替代解決方案:

您還可以將狀態(tài)更新包裝到如下函數(shù)中:

轉(zhuǎn)這個:setState("foo")

進入這個:setState((state, props) => "foo")

第二種形式(傳遞函數(shù)而不是直接傳遞狀態(tài))可確保引用正確的狀態(tài)。因此,在您的情況下,第二個狀態(tài)更新將引用更新后的狀態(tài)。


查看完整回答
反對 回復(fù) 2023-08-05
  • 1 回答
  • 0 關(guān)注
  • 107 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號