React中使用setState修改state的值并输出其修改后的结果

export default class BindEvent extends React.Component{
    constructor(){
        super()
        //私有数据
        this.state = {
            msg:'嘿嘿',
            name : 'zs',
            age : 22,
            gender : '男'
        }
    }
    render(){
        return<div>
            BindEvent 组件
            <hr/>
            
            <button onClick = {()=>this.show('Hello,', 'World!')}
            >按钮啊</button>
            <h3>{this.state.msg}</h3>
        </div>
    }
   
    show = (item1, item2) => {
        this.setState({
            msg: 'haha ' + item1 + item2,
            name : '李四'
        }, function(){
            console.log(this.state.msg);
        })
        //console.log(this.state.msg);
        //异步执行，更新未完毕，便执行了输出
        //需要使用this.setState({}, callback)回调函数
    }
}

需要注意的有两点：

1. 使用setState只会把对应的state状态更新，而不会覆盖其他的state状态。
2. 修改完毕后，不能够直接输出修改的值，因为serState是异步操作，很有可能修改未完成，就进行了输出，导致输出结果为初值，可以使用自带的回调函数来解决异步问题