Reactjs ES6 arrow函数绑定和gulp编译错误

通过阅读官方ES6文档和其他博客，我一直在努力完成下面的代码段：

onHomeStoreChange = () => (newState) {
    this.setState(newState);
}

我用过这个。 但是看起来gulp没有正确地完成它的工作，我得到了

类属性

错误后需要一个分号，但即使在放置一个

之后，这个

仍然是

未定义的

。下面是使用transform的gulp文件的一部分

appBundler
    // transform ES6 and JSX to ES5 with babelify
    .transform("babelify", {presets: ["es2015", "stage-0", "react"]})
        //.transform(babelify.configure({stage: 0}))
    .bundle()
    .on('error',gutil.log)
    .pipe(source('bundle.js'))
    .pipe(gulp.dest(buildDestination));

我使用react

0.14.5

，这些是我的开发依赖项

"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-stage-0": "^6.3.13",
"babelify": "7.2.0",
"browserify": "^12.0.1",
"gulp": "^3.9.0",
"gulp-if": "^2.0.0",
"gulp-streamify": "^1.0.2",
"gulp-uglify": "^1.5.1",
"gulp-util": "^3.0.7",
"vinyl-source-stream": "^1.1.0"

我很困惑，任何帮助都将不胜感激

编辑-添加完整代码

export default class App extends React.Component {
  constructor(props) { //put componentWillMount code in constructor
    super(props);

    //this.bindMethods();
    this.state = HomeStore.getState();
  }

  componentDidMount() {
    HomeStore.listen(this.onHomeStoreChange);
  }

  componentWillUnmount() {
    HomeStore.unListen(this.onHomeStoreChange);
  }

  onHomeStoreChange = (newState) => {
    //I had syntax error here
    this.setState(newState);
  }

  render() {
      return (
        <div>
          components will go here
        </div>
      );
  }

  bindMethods() {
    this.onHomeStoreChange = this.onHomeStoreChange.bind(this);
  }
}

导出默认类App扩展React.Component{
构造函数（props）{//put componentWillMount构造函数中的代码
超级（道具）；
//这个.bindMethods（）；
this.state=HomeStore.getState（）；
}
componentDidMount（）{
HomeStore.听着（这个.onHomeStoreChange）；
}
组件将卸载（）{
HomeStore.unListen（此为onHomeStoreChange）；
}
onHomeStoreChange=（newState）=>{
//我这里有语法错误
this.setState（newState）；
}
render（）{
返回(
组件将放在这里
);
}
bindMethods（）{
this.onHomeStoreChange=this.onHomeStoreChange.bind（this）；
}
}

---

如果我使用bindMethods（），它可以工作，但不能=>

您有一组额外的括号。arrow函数的参数应放在第一组括号中：

onHomeStoreChange = (newState) => {
    this.setState(newState);
};

---

您看到的错误是因为您有效地将HomeStoreChange上的

定义为
（）=>（newState）
，然后在后面加上和额外的
{…}
块。
您有一组额外的括号。arrow函数的参数应放在第一组括号中：

onHomeStoreChange = (newState) => {
    this.setState(newState);
};

您看到的错误是因为您已经有效地将
onHomeStoreChange
定义为
（）=>（newState）
，然后在它后面加上额外的
{…}
块。
您也可以显示围绕此段的实际代码吗？请这样使用：
onHomeStoreChange=（newState）=>this.setState（newState）
@thefourtheye updated为什么在那里使用arrow函数？类属性是ES7！因为还没有标准，这是一个实验性的特性。建议的规范需要一个分号。您是否也可以显示围绕此段的实际代码？请这样使用：
onHomeStoreChange=（newState）=>this.setState（newState）
@thefourtheye updated为什么在那里使用arrow函数？类属性是ES7！因为还没有标准，这是一个实验性的特性。建议的规范要求使用分号。Hi N3dst4。你有一部分是正确的，我有语法错误，看看这个链接，但现在它是关于分号的抱怨，我把它的OK。但是有些教程没有分号。如果函数是非本机react组件方法，那么使用分号是很不明智的。是的，您可能不需要分号。不过，您确实需要修复arrow函数语法；）修好了。知道为什么gulp现在抛出分号错误了吗？关于取消该限制，还有一个公开的巴别塔问题。似乎它只是标准的一部分（要求在类属性上使用半字符），并被添加到babel.Hi N3dst4中。你有一部分是正确的，我有语法错误，看看这个链接，但现在它是关于分号的抱怨，我把它的OK。但是有些教程没有分号。如果函数是非本机react组件方法，那么使用分号是很不明智的。是的，您可能不需要分号。不过，您确实需要修复arrow函数语法；）修好了。知道为什么gulp现在抛出分号错误了吗？关于取消该限制，还有一个公开的巴别塔问题。似乎它只是标准的一部分（在类属性上要求使用半字符），并被添加到了babel中。