ES6括弧のない矢印機能

Question

次のES6の構文を理解するのは苦労しています。私は、ドキュメントにかなり読んで、複数の変更がここに起こっているように思える：

const renderInput = function renderInput(props) { 
    return <div> 
      <label>{props.placeholder}</label> 
     </div> 
} 

：

const renderInput = props => 
    <div> 
    <label>{props.placeholder}</label> 
    </div> 

は、上記のと同等のでしょうか？

Answer 1

はい、正しいです。 の式がの場合、それは関数から返りたい式ですが、中括弧は省略することができます。

<div><label>{props.placeholder}</label></div>が、実際には、単一の式（それはReact.createElement(......)またはそのような何かにtranspiledます）で、あなたがrenderInputからそれを戻したいので、それはあなたが矢印機能の無ブラケットのバージョンを使用する方法を確かにあります。

変数を使用するか、他の計算（条件、forループなど）をしたければ、角括弧を省略することはできませんでした。