1 updater: 通过函数或对象 更新数据 FUNCTION/OBJECT
2 callback: 更新成功后的回调 FUNCTION
buttonOnClick=()=>{ this.setState({ list:[...this.state.list,this.state.inputValue], inputValue:"" //正加后input框的值为空 },()=>{ //setState 完成之后的回调 console.log(this.ul.querySelectorAll("li").length) //写在回调之后 }) }3 异步:react通常会集齐一批需要更新的组件,然后一次性更新来保证渲染的性能
Fn=()=>{ let StateNub = this.state.nub //方法2 新建变量 this.setState({ nub : StateNub +1, //内部的实现原理不是覆盖 是找对应的数据,去浅合并 sex: "可爱的胖子" }) } //里面写个函数 setName=()=>{ this.setState(()=>{ return {name:'你好'} }) } render() { //render方法 要有返回值 // let {nub} = this.state //方法1 解构 p标签里直接写{p} return ( <div> <button // 当点击事件里触发多个函数时这么写, // setState渲染原理: // 当Fn执行完setState修改值 render不渲染 ,等着setName修改完render在渲染 onClick={()=>{ this.Fn() this.setName() } } > 长大了 </button> </div> ); }4 浅合并 Object.assign() this.setState 内部的实现原理不是覆盖 是找对应的数据,去浅合并