1 回答

TA貢獻(xiàn)1796條經(jīng)驗(yàn) 獲得超10個(gè)贊
這里幾乎沒(méi)有什么事情做得不好。
對(duì)于初學(xué)者來(lái)說(shuō),當(dāng)你將數(shù)組作為第二個(gè)參數(shù)傳遞給 時(shí)useMemo
,React 將比較它的值是否嚴(yán)格相等,即===
. 每次比較都會(huì)失敗,因?yàn)?code>merged每次運(yùn)行掛鉤時(shí)都會(huì)重新分配變量。
如果您想比較數(shù)組包含的先前值和新值,我可以想到兩種方法:
直接
merged
作為第二個(gè)參數(shù)傳遞而不是將其放入數(shù)組中,這樣 React 將直接比較其中的值。我不確定這是否可行,因?yàn)橹悼赡懿粫?huì)總是以相同的順序排列。您可以在每次掛鉤運(yùn)行時(shí)存儲(chǔ)數(shù)組的“舊”值(
useState
例如使用掛鉤)并自己將這個(gè)舊值與新值進(jìn)行比較,然后相應(yīng)地設(shè)置一個(gè)布爾值。這樣,這個(gè)布爾值可以作為數(shù)組中的第二個(gè)參數(shù)傳遞給您的useMemo
.
此外,正如文檔所述,useMemo“返回一個(gè)昂貴的計(jì)算值”。因此,為了了解它的工作原理,您應(yīng)該以這種方式獲得“結(jié)果”值:
const result = React.useMemo(() => {
if (merged.length) {
return [...new Map(merged.map((item: any) => [key(item), item])).values()]
}
return []
}, merged); // will or won't work, I'd say go with the comparison yourself as stated before
最后,如果您只想從鉤子中返回一個(gè)值,則無(wú)需將其包裝在數(shù)組中,您可以這樣做:
return result;
添加回答
舉報(bào)