如何在React中设置嵌套状态
我尝试通过做这样的嵌套属性来组织我的状态
this.state = { someProperty: { flag:true } }
然后我试图更新我的状态
this.setState({someProperty.flag: false});
它不这样工作。
为了setState
嵌套的对象,你可以按照下面的方法,因为我认为setState不处理嵌套的更新。
var someProperty = {...this.state.someProperty} somePrperty.flag = true; this.setState({someProperty})
这个想法是创build一个虚拟对象执行操作,然后用更新的对象replace状态
使用包不可变性帮手 :
import update from 'immutability-helper'; const newState = update(this.state, { someProperty: {flag: {$set: false}} }; this.setState(newState);
如果您正在使用ES2015,则可以访问Object.assign。 您可以按如下方式使用它来更新嵌套的对象。
this.setState({ someProperty: Object.assign(this.state.someProperty, {flag: false}) });
您将已更新的属性与已有的属性合并,并使用返回的对象来更新状态。
把它写在一行中
this.setState({ someProperty: { ...this.state.someProperty, flag: false} });