Javascript 渲染<；选择>；及<；选项>；在单独的组件中

当

select

和

option

一起使用时，我不能完全确定引用是如何工作的，但是将它们拆分为单独的React组件会导致它们不工作。我怎样才能让它工作

基本示例：

<select>
    {() => (
        <React.Fragment>
            <option>I do not render</option>
            <option>I not render as well</option>
        </React.Fragment>
    )}
</select>

{() => (
我不渲染
我也不渲染
)}

React.Fragment

是必需的，因为组件只能呈现一个实体。我在考虑/玩弄

React.createRef

，但最终我不知道事情是如何运作的

---

代码沙盒：

这背后的原因是，从技术上讲，您只需使用以下命令创建一个箭头函数：

() => (
   <React.Fragment>
      <option>I do not render</option>
      <option>I not render as well</option>
   </React.Fragment>
) 

（）=>(
我不渲染
我也不渲染
) 

因此，下面您也在调用已定义的函数

如果按以下方式更改，它将渲染选项：

<select>
     {
         (() =>
            <React.Fragment>
               <option>I do not render</option>
               <option>I not render as well</option>
            </React.Fragment>
         )()
     }
</select>

{
(() =>
我不渲染
我也不渲染
)()
}

第二种技术称为IIFE，如文件所述：

IIFE（立即调用的函数表达式）是一个JavaScript函数，定义后立即运行

请在此进一步阅读：

代码沙盒：

请在这里找到：

---

我希望这有帮助

非常有帮助，今天学到了一些新东西。很appreciated@Andrew很乐意帮忙！