我正在努力理解 Redux，并且在點擊 React 頁面上的按鈕時失去了本地狀態。情況如下：
假設你在一個 React 頁面上，它有一個本地狀態：
{"player": "PersonA"}
在同一個 React 頁面上還有一個按鈕。按下按鈕會觸發 Redux 操作。關聯的控制器方法回傳：
return res.status(200).json({
statusCode: 200,
success: true,
payment: {"amount": "3", "currency": "EUR"},
});
和減速機：
case APPLY_SUCCESS:
console.log(...state); // returns undefined
return { ...state, paymentData: action.payload.payment };
點擊 React 頁面上的按鈕后，本地狀態僅包含paymentData. 所以player從當地狀態消失了。我認為...state在 reducer 中應該確保維護不受操作影響的現有本地狀態。所以它只會附加paymentData到本地狀態并保留player.
我的問題：
- 我是否正確，
...state在減速器中應該確保不受動作影響的本地狀態仍然是本地狀態的一部分？ - 如果是這樣，可能是什么原因
...state未定義？我如何確保player仍然是當地國家的一部分？
uj5u.com熱心網友回復：
console.log(...state)可能會引發型別錯誤，因為傳播通常在陣列和物件內部完成。
但是，您回傳的第二部分{...state, paymentData: data}應該按預期作業，只有 paymentData 從狀態更改，因為{...state}只是制作狀態物件的淺表副本（不是深），然后替換此副本中的 paymentData 鍵。
如果您使用的是深度嵌套的鍵，我會研究 lodash 的 deepClone 函式來創建狀態的深層副本，而不是淺層副本，以防止直接寫入 redux 狀態（并產生意外的錯誤）
推薦：
檢查是否console.log(state)未定義或為空物件。
如果是這種情況，狀態沒有被傳遞到 reducer，或者沒有被正確初始化，你應該檢查它是如何被傳遞的。
確保 reducer 遵循此模型以正確初始化它。這取自 redux 自己的檔案，您可以在那里查看更多示例。
const initialState = {
todos: [
{ id: 0, text: 'Learn React', completed: true },
{ id: 1, text: 'Learn Redux', completed: false, color: 'purple' },
{ id: 2, text: 'Build something fun!', completed: false, color: 'blue' }
],
filters: {
status: 'All',
colors: []
}
}
// Use the initialState as a default value
export default function appReducer(state = initialState, action) {
// The reducer normally looks at the action type field to decide what happens
switch (action.type) {
// Do something here based on the different types of actions
default:
// If this reducer doesn't recognize the action type, or doesn't
// care about this specific action, return the existing state unchanged
return state
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/466847.html
標籤：javascript 反应 还原
上一篇：response.ok是否適用于任何2xxHTTP狀態？
下一篇：單擊時顯示類屬性值