this.setState的兩種寫法

首先定義兩個變量

this.state = {
      name : "sss",
      age : 1,
}

第一種寫法，直接改變

this.setState({
      name: "ttt",
})

第二種寫法，回調函數

this.setState({
      age : 2,
},()=>{
      console.log('年齡-setState回調里面：'+this.state.age);
})

看一下這兩種寫法的結果

 

 完整代碼

handleClick(){
        console.log('姓名-初始：'+this.state.name); //sss
        console.log('年齡-初始：'+this.state.age); //1
        this.setState({
            name: "ttt",
        })
        console.log('姓名-沒有回調：'+this.state.name);//sss
        this.setState({
            age : 2,
        },()=>{
            console.log('年齡-setState回調里面：'+this.state.age);//2
        })
        console.log('年齡-setState回調外面：'+this.state.age);//1
    }

    render(){
        return(
            <div>
                <Button onClick={this.handleClick.bind(this)}>點擊！！！</Button>
            </div>
        )
    }