react 修改值

react 和 vue不太一樣

vue直接通過修改data里面的值就可以改變視圖view

但是react是通過  this.setState 這個方法來改變狀態（也就是值）

//類定義一個組件,綁定一個點擊事件改變值
            class Click extends React.Component {
                constructor(props){
                    super(props)
                    this.state ={  //設置的默認值
                        name:'浪里白漂'
                    }
                    this.handleClick=this.handleClick.bind(this)  //這里一定要通過 bind綁定，不然 this 指向就無效
                }
                handleClick(){ 
                     this.setState({ //點擊事件調用 setState 方法，設置一個新的值
                         name:'高速浪子'
                     })
                }
                render(){
                    return (
                        <div>
                            <button onClick={this.handleClick}>
                            點擊
                            </button>
                            <span>{this.state.name}</span>
                        </div>
                    )
                }
            }
            ReactDOM.render(
                <Click/>,document.getElementById('example')
            )

結果如下：