加载中...
  • react中三种函数调用方法总结

    方式一:内联调用法

    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

    上一篇:
    umijs qiankun 初体验
    下一篇:
    好的句子收集(二)
    本文目录
    本文目录