我有一個具有回呼的組件。它依賴于存盤在 redux 中的一組普通舊物件，這些物件不會經常更改，而組件本身會非常頻繁地更改其狀態。一些子組件應該在這些狀態更改時重新呈現，但使用回呼的子組件不應該。
使陣列成為依賴項的最佳方法是useCallback()什么？到目前為止，我一直在使用
const handleAllItemsSelectedChange = useCallback(
checked => {
if (checked) {
dispatch(setSelected(items));
} else {
dispatch(selectSelected([]));
}
},
// eslint-disable-next-line react-hooks/exhaustive-deps
[JSON.stringify(items)]
);
這似乎并不理想，而且可能比每次重新渲染組件慢。我無法想象這不是一個非常常見的用例。React 團隊肯定有這方面的最佳實踐，對吧？我在檔案中找不到它。
uj5u.com熱心網友回復：
JSON.stringify或者任何深入的比較都將是低效和緩慢的。React 沒有計劃支持它
根據您是添加還是洗掉專案（如果不改變物件），您可以與items.length. 或者您可以通過每次只創建函式來節省性能，而不是嘗試將其放入useCallback.
這是一個個案的情況
uj5u.com熱心網友回復：
在 redux reducer 每次陣列更改時，您都必須創建新陣列。因此，您的陣列變得不可變，您可以通過參考將其用于依賴項。下面的例子只是演示了原理。
function reducer(state, action) {
switch(action.type) {
case "addItem":
return {...state, items: [...state.items, action.value]};
case "changeProp":
return {...state, prop: action.value}
default:
return state;
}
}
正如您所看到的，每次陣列更改時，您都會獲得該陣列的新實體。這意味著您可以通過參考使用它，而不再需要對其進行強化：
const handleAction = useCallback(checked=>{
....
}, [items]);
順便說一下，不變性是 redux 檔案推薦的方法
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/354960.html
上一篇：無法使用material-ui(mui-v5)和reactjs使選單寬度與容器寬度相同
下一篇：不能從減速器功能控制臺日志狀態？