3 回答

TA貢獻(xiàn)1775條經(jīng)驗(yàn) 獲得超11個(gè)贊
在 React 中,您需要避免直接狀態(tài)突變,因?yàn)樗鼤?huì)阻止 React 準(zhǔn)確跟蹤發(fā)生的更改。假設(shè)data
是一個(gè)數(shù)組,您可以像這樣創(chuàng)建它的副本:
const tmpData = [...data];
或者
const tmpData = Array.from(data);
并根據(jù)需要編輯它,而不會(huì)在更新狀態(tài)之前導(dǎo)致不需要的突變 setState

TA貢獻(xiàn)1796條經(jīng)驗(yàn) 獲得超4個(gè)贊
tmpData
是 的淺拷貝data
。由于引用 fromtmpData
是data
通過淺拷貝維護(hù)的,這就是為什么您仍在 mutating data
。
請(qǐng)嘗試以下操作:
const tmpData = data.slice()
這將創(chuàng)建一個(gè)新數(shù)組,該數(shù)組應(yīng)該中斷對(duì)原始數(shù)組的引用,從而允許您按照自己的意愿創(chuàng)建data
. 希望能幫助到你

TA貢獻(xiàn)1805條經(jīng)驗(yàn) 獲得超9個(gè)贊
React 使用淺比較來(lái)檢查當(dāng)前 props 和 nextProps 對(duì)象以及當(dāng)前 state 和 nextState 對(duì)象是否相等。這意味著如果狀態(tài)中的所有鍵都具有相同的值,React 將永遠(yuǎn)不會(huì)重新渲染組件。
在您的代碼tmpData中等于data,它們都是同一個(gè)對(duì)象的索引。
function shallowEqual(state, nextState) {
if ( state === nextState) {
return true;
}
return Object.keys(state).every(key => state[key] === nextState[key]);
}
添加回答
舉報(bào)