数组push的问题

Question

代码：this.state={     data:[] }this.arr=[]this.setState({      data:this.state.data.push(ele)    //此时提示push不是一个方法})   this.arr.push(ele)    //正常运行虽然说push返回的是新数组的长度，但是this.arr确可以用push，而this.state.data确不可以用而只能用cancat，这是为什么？

Answer 1

setState是用来更新State的，而你push也是为了更新数据（实际上这是不允许的，因为更新数据只能用setState）。

试一试这样

this.setState({ 
   data:[...this.state.data,ele]//setState里面设置新的值应该是赋值，而不是执行相关的函数
   })

Answer 2

在React的渲染机制中，直接修改状态值不能触发重新渲染，只能通过调用setState的方式执行，这个方法是个异步方法，它将改动放到一个队列中，React会合并这个队列中的所有改动，判断state是否发生改变，从而决定是否需要重新渲染。

对于数组类型的state，比如这里的data. React规定：state中包含的所有状态都应该是不可变对象。这样它在判断状态是否发生变化时就很简单了-只需要判断引用是否一样即可。 而数组的concat方法就是创建了一个全新数组，React这才认为state.data发生变化了。