1. this.setState不會立即生效
React中使用this.setState的對象用法時矢腻，不會立即改變組件中state的值
//更新狀態(tài)
this.setState({count: count + 1}）物延；
這就會導致下面的操作達不到字面上直觀的效果皮假。
字面上看凯傲，調用incrementMultiple，應該會導致state加了3稀轨，實際上只增加了1。
function incrementMultiple() {
this.setState({count: this.state.count + 1});
this.setState({count: this.state.count + 1});
this.setState({count: this.state.count + 1});
}
這是因為岸军，this.setState并沒有立即更改this.state奋刽，所以三次操作都在反復設置同一個值。
2. setState的函數用法
this.setState還可以接受一個函數作為參數艰赞。
React官網上說佣谐，這個函數接收兩個參數，第一個是當前的state方妖，第二個是當前的props狭魂，函數返回一個對象，與之前使用this.setState的返回對象相同党觅，代表想對state的更改雌澄。
function increment(state, props) {
return {count: state.count + 1};
}
從上面的描述，我讀到的兩個意思杯瞻，一個是：把一個函數作為參數傳給this.setState镐牺，那這個函數不管叫什么，他都有兩個入參又兵；第二個是：這個函數的第一個參數是當前的state,第二個參數是當前的props任柜，不管他們叫什么。
用著試試吧沛厨，把這個入參打印出來宙地，入參就頑皮地叫做cc吧
function plusone(cc, props){
console.log(cc);
return{count: cc.count + 1};
}
class AddByFunction extends React.Component {
constructor(props){
super(props);
this.state = {count: 0};
this.increment = this.increment.bind(this);
}
increment() {
this.setState(plusone);
this.setState(plusone);
}
render(){
console.log('cc');
return (
<div>
<button onClick={this.increment}>AddByFunction</button>
<h2>Result:{this.state.count}</h2>
</div>
);
}
}
ReactDOM.render(
<AddByFunction />,
document.getElementById('root')
);
image.png
點擊一次按鈕，確實實現(xiàn)了累加兩次的效果逆皮，從控制臺的打印也可以看出來宅粥，入參cc是一個state對象，并且每次調用plusone之前电谣，cc都合并了之前的狀態(tài)修改結果秽梅。
這樣一來，用函數方式來使用setState剿牺，就更符合直觀的邏輯了
