reactjs – React组件中的意外标记’=’

发布时间：2020-12-15 20:17:20 所属栏目：百科来源：网络整理

导读：参见英文答案 How to use arrow functions (public class fields) as class methods?????????????????????????????????????4个 ???????????? Unable to use Arrow functions inside react component class ????????????????????????????????????2个 ????????

参见英文答案 > How to use arrow functions (public class fields) as class methods?????????????????????????????????????4个
>???????????? Unable to use Arrow functions inside react component class ????????????????????????????????????2个
>???????????? React Webpack “unexpected token” named arrow function????????????????????????????????????1个
我可能错过了装载机吗？我以为我们应该能够在组件体中使用这些ES6函数来避免必须执行.bind(this)语法 react docs

ERROR in ./client/admin-side/components/Form.jsx
Module build failed: SyntaxError: Unexpected token (15:17)

  14 | 
> 15 |     handleChange = (event) => {
     |                  ^
  16 |         this.setState({value: event.target.value})
  17 |     }

我的.babelrc有以下内容：

{
    "presets": ["env","react"],"plugins": ["transform-object-rest-spread"]
}

我正在使用babel-loader获取js / jsx文件

解决方法

您需要使用transform-class-properties插件来使用类字段,您可以像安装它一样安装它

npm install --save-dev babel-plugin-transform-class-properties

并将其用作插件

{
    "presets": ["env","plugins": ["transform-object-rest-spread","transform-class-properties"]
}

transform-object-rest-spread用于其余的扩展语法

const {a,b,...rest} = this.props

根据documentation：

This presents two related proposals: "class instance fields" and
"class static fields".

"Class instance fields" describe properties intended to exist on
instances of a class (and may optionally include initializer
expressions for said properties).

"Class static fields" are declarative properties that exist on the
class object itself (and may optionally include initializer
expressions for said properties).

This proposal is currently at Stage 2.

您也可以通过安装使用预设stage-2来解决这个问题

npm install --save-dev babel-preset-stage-2

并使用它像

{
    "presets": ["env","react","stage-2"],"plugins": ["transform-object-rest-spread"]
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!