矢印機能は、バベルを使用してReactコンポーネントの予期しないトークンとみなされます

Question

私の反応コンポーネントの1つにこの機能があります。

ウェブパックウォッチがヒットすると、矢印機能で予期しないトークンエラーが発生します。 transform-es2015-arrow-functionsプラグインを有効にしましたが、結果を変更するようには見えません。

ここで間違っていることに関するアイデアはありますか？

Answer 1

クラスプロパティ初期化子を使用する場合は、等号が必要です。

export default class EventTags extends React.Component { 
    showAll =() => { 
    this.setState({ 
     showAll: true, 
     showBtn: false 
    }); 
    }; 
} 

• あなたはtransform-class-propertiesバベルクラスメソッドとは異なり
• を有効に変換していることを確認し、クラスプロパティの初期化子は、セミコロンarrow functions in ES6 React componentsショー長い例で

バベルのドキュメントを記述する必要があります。

Answer 2

矢印機能を割り当てる必要があります。名前付き矢印機能を作成するための正しい構文は次のとおりです。

const showAll =() => { 
    this.setState({ 
    showAll: true, 
    showBtn: false 
    }); 
}