用新数组替换不可变状态的数组——react/redux答案

【问题标题】：replace an array in immutable state by new array -- react/redux用新数组替换不可变状态的数组——react/redux
【发布时间】：2018-06-17 07:58:08
【问题描述】：

我在 reducer 中有一个不可变的状态：

const initialState = fromJS({
  rates: [], 
  fromDialogOpen: false, 
  mealPlans: [], 
  roomTypes: [], 
  editRateFormOpen: false, 
  rateToEdit: "", 
  selectedDate: moment().toDate(), 
  selectedRoomType: null, 
  selectedMealPlan: null 
});

我做了一个 api 调用，结果是一个空数组 [] 或对象数组

[
    0: Object { doubleRackRate: 200, singleRackRate: 120, mealPlan: "AI", … }  
    1: Object { doubleRackRate: 12, singleRackRate: 1200, mealPlan: "AI", … }
    2: Object { doubleRackRate: 12, singleRackRate: 12, mealPlan: "AI", … }
    3: Object { doubleRackRate: 12, singleRackRate: 12, mealPlan: "AI", … }             
    4: Object { doubleRackRate: 12, singleRackRate: 12, mealPlan: "AI", … }   
]

作为 action.payload 发送状态更新！

当我从 API 调用收到数组时，我需要将我的费率状态更新为我收到的值 - 即空数组或对象数组！！

我该怎么做？我试过了：

return Object.assign( ...state, {rates:action.payload})

但这没有用！！

【问题讨论】：

尝试：return Object.assign({}, state, { rates: action.payload || [] }); .希望您的 action.payload 包含结果数据/数组。

标签： reactjs react-redux

【解决方案1】：

你的想法是对的，但你的语法是错误的。

选项 1

使用 Object.assign 仅更改费率字段。

return Object.assign(state, {rates:action.payload})

有些人可能会认为这是非正统的，因为它直接改变状态。

选项 2

返回一份状态副本，其中仅使用扩展语法更改了费率。

return { ...state, rates: action.payload }

对于 immutable.js

const { set } = require('immutable')
return set(state, 'rates', action.payload)

Immutable.js documentation explains it in more detail.

【讨论】：

这对我不起作用！！我可以将数组更新为合并为：return state .update('rates',rates=>rates.merge(action.payload));，但这不是我想要的。
Object.update 不是函数。你确定state 是一个对象吗？
我实际上的状态为：const initialState = fromJS({ rates:[], fromDialogOpen: false, mealPlans: [], roomTypes:[], editRateFormOpen:false, rateToEdit:"", selectedDate:moment().toDate(), selectedRoomType:null, selectedMealPlan:null });，我只需要更新rates:[]。
正如我所怀疑的，状态不是一个普通的对象，而是一个 immutable.js 的不可变对象。你在你的问题中省略了这个花絮。我在答案中添加了一个针对 immutable.js 用户的解决方案。
这对我有用：return state .set('rates', action.payload) 虽然return set(state, 'rates', action.payload) 给了我错误！谢谢你:)