2016-07-06 10 views
1

から返さリアクト?は、オブジェクトの広がり(ES6が)なぜこの作業でマップ

ES6/Babel/Reactに新たに、慈悲をください。

UPDATE:(提案されるように)これに移動した後 :

return elements.map(e => ({...e, selected: true })); 

はこのエラーを取得: unexpected token

スプレッドは、プロジェクト内の他の場所で作業しているが:

 return [ 
      ...state, 
      element(undefined, action) 
     ] 
+1

、その後

npm i babel-plugin-transform-object-rest-spread --save-dev 

をなぜ第二のサンプルには 'return'はありませんか? – Xufox

+1

拡散配列はES6の機能ですが、オブジェクトを広げることは実験的に提案された機能なので、Babelで有効にする必要があります。 – loganfsmyth

答えて

10

矢印関数からのオブジェクトの暗黙的な戻り値は、括弧で囲まれている必要があります。ブロック。

のでreturn elements.map(e => ({...e, selected: true }));

もaziumが指摘したように、それは括弧に包まれたべきではない、選択したプロパティの構文を修正しました。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

あなたの予期しないトークンエラーがおそらく提案object spreadをサポートしていないバベルする予定です。を参照してください。配列の広がりはes6です。以下の答えのようにプラグインを使用すると、この問題が解決されます。 ::バインディング演算子のような他のクールな機能を得るので、オブジェクトの広がりを含めるための私の好みの方法はバベル段階0です。オブジェクトのスプレッドは、ステージ2であるので、あなたはまた、あなたがステージ1と0

https://babeljs.io/docs/plugins/preset-stage-0/

+0

何らかの理由で予期しないトークンを取得しています(元の質問に添付されている画像)。 – Guy

+0

@Andy_D:提案です、それは** ES7の一部ではありません。 –

+0

@FelixKling良い点。編集された答え。 –

0

ES7仕様から変換スプレッドオブジェクトの残りの部分を含めない場合のうち、バベルでサポートされていないことを使用することができますボックス。そのためにはプラグインを使用する必要があります。

、このプラグインをインストールするには:あなたの.babelrcにこれを追加し

{ 
    "plugins": ["transform-object-rest-spread"] 
} 

詳細情報here

+0

オブジェクトスプレッドはES7(http://www.ecma-international.org/ecma-262/7.0/)の一部ではありません。それは提案です。 –

関連する問題