一.基本用法

在以类继承的方式定义的组件中，为了能方便地调用当前组件的其他成员方法或属性（如：this.state），通常需要将事件处理函数运行时的 this 指向当前组件实例。

绑定事件处理函数this的几种方法：

第一种方法：

      run(){alert(this.state.name)}

renturn中

不能直接写this.run(this)这样写代表执行该方法需要写bind。

应为this.run.bind(this)

      <button onClick={this.run.bind(this)}>按钮</button>

第二种方法：

    构造函数中改变

    this.run = this.run.bind(this);

 

     run(){alert(this.state.name)}

return中写

     <button onClick={this.run>按钮</button>

第三种方法：

     run=()=> {alert(this.state.name)}

renturn中写

    <button onClick={this.run>按钮</button>

二.注意事项    

注意this指向

方法中不能写this.state.msg

• 可以改变this的指向方法，在onclick调用的时候，将this传递进去。
• 通过构造函数改变
• 通过箭头函数改变（最常用）

三.改变state值

通过改变this指向直接改变

在return中直接写小括号，小括号，代表执行。

应这样传值this.setName.bind(this,'张三')

参考代码

import React from 'react';import '../assets/css/index.css';class Home extends React.Component{// 子类必须在constructor方法中调用super方法，否则新建实例时会报错。这是因为子类没有自己的this对象，而是继承父类的this对象，然后对其进行加工。如果不调用super方法，子类就得不到this对象constructor(props){super(props);   //固定写法this.state={msg:'我是一个home组件',message:'我是一个message',username:'itying'}   //第二种改变this指向的方法this.getMessage= this.getMessage.bind(this);}run(){alert('我是一个run方法')}getData(){alert(this.state.msg);}getMessage(){alert(this.state.message);}getName=()=>{alert(this.state.username);}//第三种改变this指向的方法setData=()=>{//改变state的值this.setState({msg:"我是一个home组件 这是改变后的值"})}setName=(str)=>{//改变state的值this.setState({username:str})}render(){return(<div><h2>{this.state.msg}</h2>    <h2>{this.state.username}</h2>     <button onClick={this.run}>执行方法</button><br /><br /><button onClick={this.getData.bind(this)}>获取数据--第一种改变this指向的方法</button><br /><br /><button onClick={this.getMessage}>获取数据--第二种改变this指向的方法</button><br /><br /><button onClick={this.getName}>获取数据--第三种改变this指向的方法</button><br /><br /><button onClick={this.setData}>改变state里面的值</button><br /><br /><button onClick={this.setName.bind(this,'张三')}>执行方法传值</button>{/* <button onClick={this.setName.bind(this,'张三','李四')}>执行方法传值</button> */}</div>)}    
}
export default Home;