Javascript 更新深层的JS状态

我有一个处于ReactJS组件状态的项目数组，我正在迭代该数组以创建一个表单。我的问题是：当字段更改时，如何最好地更新这些项

例如：

var items = this.state.foo.bar.items.map(function(item, i) {
    return <input value={item.baz} onChange={??}
});

var items=this.state.foo.bar.items.map（函数（item，i）{
return通过
bind
将索引传递给
onChange
，然后动态构建要传递给
update
的对象，可以使用索引来更新正确的数组项：

var Hello = React.createClass({
    getInitialState : function() {
      return  {
        foo : {
          bar : {
            items : [ { baz : 1 }, { baz : 2 }, { baz : 3 } ]
          }
        }
      };
    },
    onChange : function( idx, item, event ) {
      var objForUpdate = { foo: { bar: { items : {} } } };
      objForUpdate.foo.bar.items[ idx ] = { $set : { baz : event.target.value } };
      var newData = React.addons.update( this.state, objForUpdate );
      this.setState( newData );
    },
    render: function() {
      var _this = this;
      var items = this.state.foo.bar.items.map(function(item, i) {
        return <input value={item.baz} onChange={_this.onChange.bind( _this, i, item )}></input>
      });
      return <div>{items}</div>;
    }
});

如果您要覆盖，并且比每次调用此.setState（）

时更有选择性地选择何时重新加载

---

我想我应该把这个库扔出去，因为它是专为深度嵌套状态设计的

---

你可以更新每个组件中的项目，它会自动向上移动，而无需你定义回调来传递事件。

非常酷。我最终以更简单的方式解决了问题，但这看起来确实很有趣。你也可以使用Facebook工程师提供的Immutable.js：是的，这也很棒。这个spa中有很多东西总工程师。

onChange : function( idx, item, event ) {
  item.baz = event.target.value;
  this.setState( this.state );
}