2 回答

TA貢獻1859條經(jīng)驗 獲得超6個贊
這是重寫為不可變的減速器:
const { comparators } = state;
const { comparator, name, value } = action.payload;
if (!comparators[comparator]) {
return {
...state,
comparators: {
[comparator]: {
[name]: value
}
}
};
} else {
return !comparators[comparator][name]
? {
...state,
comparators: {
[comparator]: {
[name]: value
}
}
}
: comparators[comparator][name].includes([value])
? {
...state,
comparators: {
[name]: comparators[comparator][name].filter(val2 => val2 !== value)
}
}
: {
...state,
comparators: {
[comparator]: {
[name]: [...comparators.comparator.name, value]
}
}
};
}

TA貢獻2016條經(jīng)驗 獲得超9個贊
您正在改變 reducer 中的狀態(tài),因為您只是復制頂級對象,然后改變嵌套在其中的內(nèi)容。不可變更新總是需要為對象和數(shù)組復制每一層嵌套。
編寫 Redux 邏輯的第一條規(guī)則是:不要改變狀態(tài)。
您應該改用我們的官方 Redux Toolkit 包。它不僅會捕捉到這些意外突變并警告您,createSlice
API 還允許您實際編寫“突變”代碼,這些代碼會變成安全、正確的不可變更新。
您還應該花時間閱讀關于“不可變更新模式”的 Redux 文檔頁面,以及 Dave Ceddia 關于React 和 Redux 中不變性的完整指南的帖子。
添加回答
舉報