ImmutableJS - 更新列表中的值

时间:2015-08-01 23:50:32

标签: javascript reactjs immutable.js

我有这样的地图(在ImmutableJS中):

{arrayOfValues: [
  {one: {inside: 'first in array'}},
  {one: {inside: 'second in array'}}
]}

我想更新“arrayOfValues”数组中第二个条目中的“inside”值。我该怎么做?这就是我现在所说的“Uncaught Error:invalid keyPath”

theMap.update('arrayOfValues',(list)=>{
  return list.setIn([1,'one','inside'],'updated value'); 
})

我也直接尝试了这个并且它不起作用:

theMap.setIn(['arrayOfValues',1,'one','inside'],'updated value');

经过几个小时的寻找解决方案,我感谢任何帮助。谢谢。

3 个答案:

答案 0 :(得分:14)

你在做什么是正确的(见JSBin)。

const orig = Immutable.fromJS({
  arrayOfValues: [
    { one: { inside: 'first in array' } },
    { one: { inside: 'second in array' } },
  ]
});

const updated = orig.setIn(['arrayOfValues', 1, 'one', 'inside'], 'updated value');

console.log(updated.toJS());

// {
//   arrayOfValues: [
//     { one: { inside: 'first in array' } },
//     { one: { inside: 'second in array' } },
//   ]
// }

当您致电orig.setIn()时,它不会直接修改orig。这就是这个Immutable库的全部目的。它不会改变现有数据,而是从现有数据中创建一个新数据。

答案 1 :(得分:2)

您的setIn示例的工作正如您在此plunkr中看到的那样: http://plnkr.co/edit/1uXTWtKlykeuU6vB3xVO?p=preview

也许您假设theMap会因setIn而改变var theMap2 = theMap.setIn(['arrayOfValues',1,'one','inside'],'updated value');的价值?

由于这些结构是不可变的,您必须在新变量中捕获修改后的值/repos/:owner/:repo/issues

答案 2 :(得分:0)

  

activePane是我必须修改的数组(列表)中的对象的索引

case CHANGE_SERVICE:
  var obj = {
    title: '1212121 Tab',
    service: '',
    tagName: '',
    preDefinedApi: '',
    methodType: '',
    url: '',
    urlParams: [{
      label: '',
      name: '',
      value: '',
    }],
    headers: [{
      label: '',
      name: '',
      value: '',
    }],
  };
  var activePane = state.get('activePane');
  var panes = state.setIn(['panes', activePane, 'service'], action.val);

  return state.setIn(['panes', activePane, 'service'], action.val);