react组件写法的区别，以及代码的校验不通过？

Question

在react中我们命名组件中的方法的时候有很多中，例如第一种

class Header extends React.Component {

 constructor (props) {

    super(props)

    //（1处）

    this.getMes = this.getMes.bind(this)

    this.state = {

    }

  }

  //方法

  getMes() {

    //操作。。。。。 绑定this，可以在上面（1）处或者（2）处

  }

  render(){

    return(

      <div onClick={this.getMes.bind(this)}>(2)处</div>

    )

  }

}

上述的两种写法都可以通过standard的代码校验，(standard配置"parser": "babel-eslint",)

但是上面的这种写法比较繁琐，所以改用下面这种写法，省去了绑定this

getMes = () => {

    //操作。。。。

}

但是用这个方法写，代码校验就会说getMes 没有被定义，请问怎么解决？？？

Answer 1

在&nbsp;class&nbsp;里面直接定义&nbsp;getMes = () => {}&nbsp;这是目前&nbsp;stage 3 Class properties的写法你得先看看自己是否配置了恰当的&nbsp;babel&nbsp;支持babel pluginproposal

Answer 2

getMes = () => {}&nbsp;相对于在 jsx 中 bind 拥有更好的性能至于 eslint 语法校验问题,检查你的 eslint 配置文件,或者直接关闭它

Answer 3

你需要用const定义getMes函数，即const getMes = () => {}