react中添加事件，this问题的解决方案：

有4种方式

第一种：用bind,call,apply改变this的指向。

this.addMessage.bind(this)

import React,{Component} from 'react';
import './Comment.css'
class CommentForm extends Component{
    addMessage(){
        alert('hhh');
        console.log(this)
    }
    render(){
        return(
            <div>
                <h3>添加留言</h3>
                <div>
                    <textarea name="" id="" cols="30" rows="10"></textarea>
                </div>
                <div>
                    <button className="btnMessage" onClick={this.addMessage.bind(this)}>添加留言</button>
                </div>
            </div>
        )
    }
}
export default CommentForm

 第二种：指定事件处理时，使用箭头函数

记住：在执行的时候，addMessage()一定要加括号，不然不会执行

   <div>
                    <button className="btnMessage" onClick={()=>{this.addMessage()}}>添加留言</button>
                </div>

第三种：在构造函数中bind(this)

import React,{Component} from 'react';
import './Comment.css'
class CommentForm extends Component{
    constructor(props) {
        super(props);
        this.addMessage =this.addMessage.bind(this)
    }
    addMessage(){
        alert('hhh');
        console.log(this)
    }
    render(){
        return(
            <div>
                <h3>添加留言</h3>
                <div>
                    <textarea name="" id="" cols="30" rows="10"></textarea>
                </div>
                <div>
                    <button className="btnMessage" onClick={this.addMessage}>添加留言</button>
                </div>
            </div>
        )
    }
}
export default CommentForm

第四种：class属性

class LoggingButton extends Component {
  handleClick = () => {}
  render() {
    return (
      <button onClick={this.handleClick}>Click me</button>
    );
  }
}