如何设置嵌套对象的状态？

Question

对于我正在使用的插件，我必须具有如下状态：

getInitialState() {
  return {
    invalid: true,
    access: {
      access_code: '',
      zipcode: '',
      password: '',
      confirm: '',
      hospital_id: '',
    },
  }
},

如何在不设置其余访问权限的情况下设置hospital_id状态？

这似乎删除了一切，但hospital_id：

this.setState({access: {hospital_id: 1}})

Answer 1

我现在首选的方法如下：

let newAccess = this.state.access;
newAccess.hospital_id = 1;
setState({access: newAccess});

比目前公认的答案稍微简单一些。

编辑（基于@SILENT的问题）

看起来这实际上是一种潜在的危险方法。这里的进一步阅读：关于不变性的（非常简短的）讨论。

看起来更好的方法是：

let newAccess = Object.assign({}, this.state.access, {hospital_id:1});
this.setState({access: newAccess});

Answer 2

let newAccess = Object.assign({}, this.state.access);
newAccess.hospital_id = 1;
this.setState({access: newAccess});

Answer 3

你有几个选择：

>

使用ECMA6，您可以使用对象排列方案（…）创建具有更新属性的对象副本。

this.setState({
  access: {
    ...this.state.access,
    hospital_id: 1,
  },
});

可以在Object上使用本机赋值函数（Object.assign（））

this.setState({
  access: Object.assign({}, this.state.access, {
    hospital_id: 1,
  }),
});

或者对于最短的版本和原子更新：

 this.setState(({access}) => ({access: {
   ...access,
   hospital_id: 1,
 }});

还有一个选择是更新插件：

var update = require('react-addons-update');
// per React docs 
// https://reactjs.org/docs/update.html 
// , you may want to change this to 
// import update from 'immutability-helper';
this.setState({
  access: update(this.state.access, {
    hospital_id: {$set: 1},
  })
});

我建议使用第一个。