将单个元素添加到不可变列表

Question

我只想将元素添加到不可变对象树中某个位置的列表中。

这个问题似乎已经在这里回答了：

将值附加到列表

但是由于某种原因，它对我不起作用。

如果我有以下代码：

var myState = {
  a: {
    b: {
      c: [
        {name: 'hi', value: 2},
        {name: 'howdy', value: 3}
      ]
    }
  }
}
myState = Immutable.fromJS(myState);
myState = myState.update(['a', 'b', 'c'], function (myList) {
  myList.push({"name": "hallo", "value": 4})
  }
);

我得到一个错误：

未捕获的TypeError：无法读取未定义的属性“推”

这表示传递给回调的myList参数为null。

为什么会这样呢？

小提琴：

https://codepen.io/owatkins/pen/brMava

Answer 1

它应该这样写：

myState.updateIn(['a', 'b', 'c'], function (myList) {
    return myList.push({"name": "hallo", "value": 4})
  }
);

下面是一个工作示例：

 var myState = Immutable.fromJS({ a: { b: { c: [{ name: 'hi', value: 2 }, { name: 'howdy', value: 3 } ] } } }) myState = myState.updateIn(['a', 'b', 'c'], function(myList) { return myList.push({ "name": "hallo", "value": 4 }) }); console.info('myState = ' + myState.toJS()) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.8.1/immutable.min.js"></script> 

请注意，我使用的是updateIn而不是update并返回push的结果

Answer 2

经过大量的充实之后，我唯一能想到的解决方案是获取数组，并将其转换为JS，将元素压入其上，然后将其转换回不可变...然后使用setIn ，NOT updateIn和NOT 更新 。

var myState = {
  a: {
    b: {
      c: [
        {name: 'hi', value: 2},
        {name: 'howdy', value: 3}
      ]
    }
  }
}
myState = Immutable.fromJS(myState);

var list = myState.getIn(['a', 'b', 'c'])
var list = list.toJS();

list.push({"name": "hallo", "value": 4});

var v = Immutable.fromJS(list)

myState = myState.setIn(['a', 'b', 'c'], v)

这看起来是一个可怕的解决方案，但这是迄今为止对我唯一有效的方法。

通常，大约需要5分钟的时间来学习如何以框架或语言的形式向列表中添加元素。

我没想到它要花5 小时 。

该框架的文档绝对是可耻的。