关于React的state的问题

Question

背景：

 constructor(props) {
    super(props);
    this.state = {
        _TagList: []
    }
}
onSelectCompany() {
        console.log("this.state._TagList:",this.state._TagList);//[]
        this.state._TagList.push('垃圾');
        console.log("this.state._TagList:",this.state._TagList);//['垃圾']
        }

问题：state如何被修改，state就是一个变量，任何修改变量的方法都可以修改它，这么理解对吧？？如果对，state改变了并不会造成页面数据更新，只有调用setState了再回刷新，是吗？？

Answer 1

首先要明确一个事情，我们所说的修改state，不仅仅是修改state本身的值，更是要引发页面重新render，或者说修改state就是为了引发页面重新render。
this.state._TagList.push('');这个并不是在真正的修改state，因为它不会引发页面render，你此时去render函数里面输出最新的值，是输不出来的。真正的修改state一定是调用setState。
this.state._TagList是在取出state的值，就是个普通变量，任何修改变量的方法都可以修改它，也是对的，但是这不是在修改state。

关于正确地修改状态，官方文档说了三点：

1.不要直接更新状态。直接修改state，组件并不会重新渲染。

// 错误
this.state.name = 'React';
// 正确
this.setState({name: 'React'});

2.状态更新可能是异步的。React可能会将多次setState修改合并成一次修改来提高性能。这可能导致真正状态修改时，依赖的this.state并不能保证是最新的state，所以不要依赖当前的state计算下个state。

// 错误
this.setState({
  counter: this.state.counter + 1
});
// 正确
this.setState((prevState) => ({
  counter: prevState.counter + 1
}));

3.状态更新合并是浅合并。当调用setState修改组件状态时，只需要传入发生改变的state，而不是组件全部的state。

// 原始状态
this.state = {
  name: 'React',
  age: 3
}
// 修改状态
this.setState({
  name: 'React Native'
});

Answer 2

只有通过setState方法去修改state。相应的dom数据就会发生改变。