webpack编译时，React中ajax是用ES6箭头函数报错，请教原因

Question

我将React官网上面的发表评论的demo改写为ES6的时候，出现了如下问题：

因为使用ES6的语法，我希望能在deleteClick中使用箭头函数来使得ajax中的this指向上一层，使得this.setState生效，然而在用webpack编译的时候确报错了。

并且我尝试用

success (data){this.setState({data: data});}.bind(this)

来解决作用域问题时，webpack编译依然会报错.bind(this)的部分，如此，我就只能在deleteClick中先把this保存下来，let this = that，来使得setState可以正常调用。

请问前两个报错的原因，和是否还有其他的解决方式，谢谢

Answer 1

你语法错了，不是success = (data) => {}，而是success: (data) => {}

Answer 2

语法可以这么写，但是要加多一个包：
npm install -D babel-preset-stage-1

webpack.config.js：
{

test: /\.jsx?$/,
loader: 'babel',
include: APP_PATH,
query: {
  presets: ['es2015', 'react', 'stage-1']
}

},

如果使用.bablerc:
{
"presets": [

"es2015",
"react",
"stage-1"

],

Answer 3

因为你外层是一个类（{}），所以不可以这样声明函数：

// wrong
demo({
    url: 'xxx',
    success = (data) => {
        console.log(data)
    }
})

可以尝试这样写：

demo({
    url: 'xxx',
    success(data) {
        console.log(data)
    }
})

Answer 4

同意zsusyt的说法,亲自尝试可用,当然还可以使用 "babel-preset-stage-0": "^6.16.0",