Esxマップ配列htmlはJSXでは動作しませんか？

Question

私はconstのarr = ["james","john"];

のような機能をレンダリングでのconstを持っており、リターン機能で、私は

<select> 
    arr.map(item => 
    <option>item</option> 
    ) 
</select> 

を行う私が出力に表示することはアイテムではなく、配列の値です。何か不足していますか？私はオプションとして配列の値を設定したい。

Answer 1

JSX要素内のコンテンツは通常「テキスト」と解釈されるため、arr.map(…)は<select>要素のリテラルコンテンツとして処理されます。

（<option>item</option>は単に<select>のリテラルの子要素として扱われるため、ブラウザーでは恐らくあなたのリストに「項目」が表示されるだけなので、あなたのブラウザーは恐らくテキストを無視します）。

あなたの代わりに、単に（のリアクトクイックスタートガイドの「Introducing JSX」ページで説明したように）中括弧でそれをラップし、それがJavaScript式として扱われたい：

<select> 
    {arr.map(item => 
    <option>{item}</option> 
)} 
</select>