react 中 setState的两种写法、修改部分属性
react 想要更新视图只能用 setState( ) 方法
关于 setState() 这里有两点需要知道
1. 不要直接更新状态, 而是使用 setState()
2. 状态更新是异步的,你如果依靠它们的值来计算下一个状态不可以直接使用。
1、两种调用方式
第一种 : 直接 改变
this.setState({ msg: "我被改变了" });
第二种 :通过 setState()传入一个函数,这种用法 可以借助于 原有的state里的值
this.setState(state => { return { msg: "hello" }; });
2、修改状态后依据状态做些操作
第一种:回调函数
this.setState({ active:true },()=>{ console.log(this.state.active,'2') }) console.log(this.state.active,'1')
第二种:async / await
change = async ()=>{ await this.setState({ active:true }) console.log(this.state.active,'1') }
3、修改某个对象的部分属性,使用Object.assign()
change = (pagination, filters, sorter, extra)=>{ this.setState((state)=>{ return { params:Object.assign(state.params,{ pageSize: pagination.pageSize, pageNum: pagination.current }) } }) }