react中事件的使用

import React from 'react'
 
class Home extends React.Component{
    constructor(props){
        super(props)
        this.state = {
            msg: 'Home组件中的数据'
        }
        this.getMessage = this.getMessage.bind(this) // 在构造器中定义this的指向
    }
    run(){
        alert('这个是run方法')
    }
    getState() {
        alert(this.state.msg)
    }
    getMessage() {
        alert(this.state.msg)
    }
    getThisData = ()=>{ // 由于箭头函数不绑定this， 它会捕获其所在（即定义的位置）上下文的this值， 作为自己的this值，
        alert(this.state.msg)
    }
    setStateData=()=>{
        this.setState({  // 使用setState来改变的state的值
            msg: '改变Msg的值'
        })
    }
    diyStateData =(msg)=>{ // 如果需要传参数到函数中，要先在bind中定义this，然后在后面传入形参
        this.setState({
            msg: msg
        })
    }
 
    render() {
        return  <div>
                    <button onClick={this.run}>执行自定义函数</button>
                    <button onClick={this.getState.bind(this)}>改变this的方式一</button>
                    <button onClick={this.getMessage}>改变this的方式二</button>
                    <button onClick={this.getThisData}>改变this的方式三</button>
                    <button onClick={this.setStateData}>改变state的值</button>
                    <button onClick={this.diyStateData.bind(this,'66666')}>改变state的值1111</button>
                </div>
    }
}
export default Home