javascript - webpack编译时,React中ajax是用ES6箭头函数报错,请教原因
大家讲道理
大家讲道理 2017-04-11 10:59:07
[JavaScript讨论组]

我将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可以正常调用。

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

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(4)
阿神

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

ringa_lee

因为你外层是一个类({}),所以不可以这样声明函数:

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

可以尝试这样写:

demo({
    url: 'xxx',
    success(data) {
        console.log(data)
    }
})
大家讲道理

语法可以这么写,但是要加多一个包:
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"

],

PHPz

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

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号