Redux：更新对象数组中的项目答案

【问题标题】：Redux : update an item in an array of objectsRedux：更新对象数组中的项目
【发布时间】：2018-09-24 10:23:54
【问题描述】：

在我的名为“reducer_product_list”的减速器中，我有这个数组：

let initialState = [
    {name: 'Article 1', price: 5, quantity: 10},
    {name: 'Article 2', price: 15, quantity: 8},
    {name: 'Article 3', price: 7, quantity: 15},
    {name: 'Article 4', price: 9, quantity: 5},
    {name: 'Article 5', price: 11, quantity: 100},
    {name: 'Article 6', price: 23, quantity: 20},
  ]

当我收到“ADD_TO_CART”操作时，我想减少所选对象的数量。有效负载就是这些对象之一。

我输入了上面的代码：

export default (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_TO_CART':
      initialState.map((product, i) => {
        if (product.name === action.payload.name) {
          initialState[i].quantity -= 1
          return state;
        }
      });
    default: return state
  }
}

如果我 console.log 我的 initialState，数量正在减少，但在我呈现视图的容器中，数量保持不变。

感谢您的帮助。

【问题讨论】：

标签： javascript reactjs redux

【解决方案1】：

试试这个：

export default (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_TO_CART':
      return state.map(product => {
        if (product.name === action.payload.name) {
          return {...product, quantity: product.quantity-1}
        };
        return product;
      });
    default: return state
  }
}

原因是您必须返回从当前状态派生的新状态对象，以根据请求的操作反映所需的更改。详情请见Redux Reducers。

【讨论】：

感谢您的帮助，效果很好！我只需要改变一件事：我不是在初始状态上映射，而是在状态上进行映射。
你需要传播状态吗？否则以前的状态会丢失对吗？理想情况下，我们永远不应该改变 redux 状态

【解决方案2】：

感谢您的帮助，效果很好！我只需要更改一件事：我不是在 initialState 上映射，而是在 state 上进行映射。

export default (state = initialState, action) => {
  switch (action.type) {
    case 'ADD_TO_CART':
      return state.map(product => {
        if (product.name === action.payload.name) {
          return {...product, quantity: product.quantity - 1}
        };
        console.log(state)
        return product;
      });
    default: return state
  }
}

【讨论】：