Reactjs 如何从功能组件返回React组件？

我试图创建一个输入选择组件，但是当渲染到界面时，它不会显示选项

export const SelectFormGroup = (argument) => {
const options = argument.options;
return (
    <Col xs={argument.xsNumber}>
        <FormGroup>
            <label>
                {argument.labelText}
            </label>
            <FormControl
                as={'select'}
                required
                placeholder={argument.placeholderText}
                defaultValue={argument.defaultValue}
            >
            </FormControl>
            {
                options.map((option) => {
                    <option>{option}</option>
                })
            }
        </FormGroup>
    </Col>
);}          

export const SelectFormGroup=（参数）=>{
const options=argument.options；
返回(
{argument.labelText}
{
options.map（（选项）=>{
{option}
})
}
);}          

在使用单行函数时，如果您放入

{}

则必须添加

返回

关键字

options.map(option => { return <...option /> })

---

您需要将选项集合放入FormControl中。 更新SelectFormGroup组件中的FormControl，如下所示：

<FormControl
      as={"select"}
      required
      placeholder={argument.placeholderText}
      defaultValue={argument.defaultValue}
    >
      {options.map((option) => {
        return <option>{option}</option>;
      })}
</FormControl>

{options.map（（option）=>{
返回{option}；
})}

什么是

Form.js

第44行？第44行只包含一个“{”。你可以在下面的图片中查看。请在你的问题中添加

Form.js

code，你只是在地图上做了一些非法的移动。对不起，这不起作用。你可以检查我的编辑问题吗？从我看到的情况来看，你没有在你的问题中添加return关键字。在你的地图函数中，你需要返回JSX，因为你没有做一行。

<FormControl
      as={"select"}
      required
      placeholder={argument.placeholderText}
      defaultValue={argument.defaultValue}
    >
      {options.map((option) => {
        return <option>{option}</option>;
      })}
</FormControl>