1. 前言
- 总结下setState用法
- 不要直接修改 State
2. 第一个参数是函数
state的更新异步的,所以React会把多个
setState调用合并成一个调用所以下面的代码可能导致无法更新计数器
错误的写法
this.setState({ counter: this.state.counter + this.props.increment, });
正确的写法
this.setState((state, props) => ({ counter: state.counter + props.increment }));
参数1: 旧的state 可选参数
参数2: props 可选参数
3. 第一个参数是 对象
this.setState({ name: 'yzs', age:32 }); //错误的写法 this.state.name = 'yzs'
4. 第二个参数是函数
this.setState({ num:this.state.num +100 },()=>{ // 异步函数 DOM更新末尾执行的 console.log("react --nextTick:",this.refs.testRef.innerHTML); //****************** 简洁写法 console.log("简洁获取DOM:",this.yzsRef.innerHTML); })
1.第二个参数是函数,第一个参数对象或者是函数都不影响
2.第二个参数是函数:作用相当于 vue的
nextTick在 OM 更新循环结束之后执行延迟回调,获取更新后的DOM
