使用ES7Decorators简化this的绑定

1.修改babelrc文件

{"presets": ["es2015", "react", "stage-1"],"plugins": ["transform-decorators-legacy"]
}

2.安装 decorator 插件

npm i -S babel-plugin-transform-decorators-legacy

3.修改webpack中loader的配置

module: {loaders: [{test: /\.js$/,exclude: /node_modules\/(?!(stardust))/,loader: &＃39;babel&＃39;,query: {cacheDirectory: true,plugins: [&＃39;transform-runtime&＃39;,&＃39;add-module-exports&＃39;,&＃39;transform-decorators-legacy&＃39;,],presets: [&＃39;es2015&＃39;, &＃39;react&＃39;, &＃39;stage-1&＃39;],},}]
}

4.安装autobind 的库

npm install autobind-decorator

5.写法改进

class MyClass extends Component {constructor(props, context) {this.onChange &＃61; this.onChange.bind(this)this.handleSubmit &＃61; this.handleSubmit.bind(this)this.state &＃61; {isLoading: true}}onChange() {}handleSubmit() {}
}

class MyClass extends Component {state &＃61; {isLoading: true}&＃64;autobindonChange() {}&＃64;autobindhandleSubmit() {}
}