web-dev-qa-db-ja.com

矢印はBabelを使用してクラスプロパティとして機能します

誰かがReactでファットアロー関数をクラスプロパティとしてサポートする方法を説明できますか?Babelを使用する 試してみてください サポートされていないことがわかります:

class Question {

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

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

}

クラスプロパティはES6ではサポートされていません(間違っている場合は修正してください)が、React(Babelを使用)では機能します。

TypeScriptを使用してメソッドとプロパティの違いを確認できます Playground ですが、Babelがそれらをサポートしているかどうかを明確に理解できません。プラグインはありますか?

更新:
"babel-preset-stage-0" を使用してサポートされていることがわかります。

8
isar

クラスプロパティをサポートするには、 babel-plugin-transform-class-properties をインストールして.babelrcplugins設定に(またはwebpack構成に)追加する必要があります。 )。

このプラグインはにも含まれていることに注意してください

したがって、これらのいずれかを使用する場合は、babel-plugin-transform-class-propertiesを自分でインストールする必要はありません。

3
GG.

@illiteratewriterが提案したように、クラスプロパティは ステージ0プリセット からサポートされます。当面は ステージ2プリセット :までサポートされます。

プロポーザルには、機能の構文とセマンティクスの正式な説明が追加で含まれている必要があります(ECMAScript仕様の正式な言語を使用)。説明はできるだけ完全にする必要がありますが、ToDoとプレースホルダーを含めることができます。この機能の2つの実験的な実装が必要ですが、そのうちの1つはBabelなどのトランスパイラーに含めることができます。

0
isar