箭头作为 class 属性使用 Babel

Question

有人可以解释一下 React 中的 Babel 如何支持作为 class 属性的粗箭头函数吗？使用 Babel Try it out 我可以看到它们不受支持：

class Question {

  // Property (not supported)
  myProp = () => {
    return 'Hello, world!';
  }

  // Method (supported)
  myFunc() {
    return 'Hello, world!';
  }

}

Class 属性在 ES6 中不受支持（如果我错了请纠正我）但是在 React 中（使用 Babel）它们可以工作。

我可以看到使用 TypeScript 的方法和属性之间的区别 Playground 但我不清楚 Babel 是否支持它们。有插件吗？

更新：
我可以看到使用 "babel-preset-stage-0".

支持它们

Answer 1

正如@illiteratewriter 建议的那样 class Stage 0 preset. For the time being, they are supported until Stage 2 preset 支持属性：

The proposal must now additionally have a formal description of the syntax and semantics of the feature (using the formal language of the ECMAScript specification). The description should be as complete as possible, but can contain todos and placeholders. Two experimental implementations of the feature are needed, but one of them can be in a transpiler such as Babel.

Answer 2

要支持 class 属性，您需要安装 babel-plugin-transform-class-properties 并将其添加到 .babelrc 的 plugins 设置（或 webpack 配置中).

请注意，此插件也包含在

因此，如果您使用其中之一，则无需自己安装 babel-plugin-transform-class-properties。

箭头作为 class 属性使用 Babel

Arrow functions as class properties using Babel

javascript

class

reactjs

babeljs

ecmascript-next