react 类组件的事件绑定方法

一、创建类组件

        在js或者jsx文件夹中输入命令如下：

import React, { Component } from 'react'

export default class a extends Component {
    render() {
        return (
            <div>
                
            </div>
        )
    }
}

        就创建了一个最基础的类组件，要渲染的内容都放在render()中

类组件的事件绑定方法有如下四种:

import React,{Component} from "react"

export default class App extends Component {
  //构造函数
  constructor(){
    super() //继承父组件
    this.handler3 = this.handler3.bind(this)
  }
  handler1(){
    console.log("第一种事件绑定")
  }
  handler2(){
    console.log("第二种事件绑定")
  }
  handler3(){
    console.log("第三种事件绑定")
  }
  handler4 = () => {
    console.log("第四种事件绑定")
  }
  render(){
    return (
      <div className='app'>
        <button onClick={this.handler1.bind(this)}>第一种事件绑定</button>
        <button onClick={() => this.handler2()}>第二种事件绑定</button>
        <button onClick={this.handler3}>第三种事件绑定</button>
        <button onClick={this.handler4}>第四种事件绑定</button>
      </div>
    )
  }
}

其中最推荐使用第三种方法，第四种方法虽然也很简便，但是目前不够稳定