使用immutableJS更新对象内部的数组不起作用

时间:2018-09-29 17:15:11

标签: reactjs redux immutable.js react-boilerplate

我正在尝试在嵌套在对象内的数组内添加对象。以下是我的结构

{
    id:'1',
    name:'test',
    contents:[
        {fruit:'banana'}
        {fruit:'apple'}
    ]
}

现在,我只是尝试使用{fruit:'pear'}更新内容。 我正在使用react-redux-boiler盘子。而且我在尝试更新内容时遇到问题。 这是我尝试过的:

const initialState = fromJS({
  data: {
    content: []
  }
});

function projectReducer(state = initialState, action) {
  switch (action.type) {
    case LOAD_DATA:
      return state
        .set('loading', true)
        .set('error', false)
        .setIn(['data', 'contents'], false);
    case LOAD_DATA_SUCCESS:
      return state
        .setIn(['data', 'contents'], action.data)
        .set('loading', false);
    case ADD_CONTENT:
      return state
        .set('loading', true)
        .set('error', false)
      // return return update(state[state.set(['data'],data)
    case ADD_CONTENT_SUCCESS:
      console.log('addContentSuccess');
      return state
        .updateIn(['data','contents'],list=>list.push({fruit:'pear'}))         //<<<<<THis is failing
        .set('loading', false)
        .set('error', false)
      break;
    default:
      return state;
  }
}

由于列表是整个对象,而不是list.contents,我得到的错误是push is not a function,这是正确的。

任何建议,帮助或解决方法都非常感谢!预先感谢!

1 个答案:

答案 0 :(得分:0)

您好像打错了字,忘记了在内容两边加上引号,这导致它不确定,因此“列表”实际上是“数据”。

我认为您的代码应为:

return state
    .updateIn(['data', 'contents'], list => list.push({fruit:'pear'}))