React Redux 状态在使用不可变方法时不更新

Question

问候 我在更新应用程序状态时遇到问题。

如果我使用打破 React 可变性原则的方法，一切正常。 这是我的状态：

const state= {
cart: {
items: [
{
productId: "A1",
quantity: "1",
unitPrice: "9"
}
]
}
};

action.payload 是：

{productId: "A2", quantity: "1", unitPrice: "11"}

它适用于这个：

case ADD_PRODUCT_TO_CART: 
state.cart.items.push(action.payload);
return state;

但是，我想使用更好的方法。像这个：

case ADD_PRODUCT_TO_CART: 
return {
...state, 
items: [action.payload, ...state.cart.items]   
};

但它不会更新我的状态。store.getState((输出初始状态。

Answer 1

您错过了cart键。

这应该有效：

case ADD_PRODUCT_TO_CART: 
return {
...state, 
cart: {                  // add cart key
...state.cart,
items: [
...state.cart.items,
action.payload       // new items will be the last
]
}
};