方式一:内联调用法
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| import React, { Component } from 'react';
class func extends Component{ constructor(porps){ super(props); } funcOne(){ console.log('内联调用法') } render(){ return ( <button onClick={this.funcOne.bind(this)}></button> ) } }
|
方式二:配置中调用法
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
| import React, { Component } from 'react';
class func extends Component{ constructor(porps){ super(props); this.funcTwo = this.funcTwo.bind(this) } funcTwo(){ console.log('配置中调用法') } render(){ return ( <button onClick={this.funcTwo}></button> ) } }
|
方式三:箭头函数调用法(最推荐)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| import React, { Component } from 'react';
class func extends Component{ constructor(porps){ super(props); } funcThree:() => { console.log('箭头函数调用法') } render(){ return ( <button onClick={this.funcThree}></button> ) } }
|
本文借鉴于:https://www.jianshu.com/p/601109471bbb