reactjs - Reactjs(Typescript) - 在 Select 字段中连接数组

Question

我正在发出一个返回 api 数组的请求，但是在执行映射时，结果不会仅连接到一个选择中，从而复制表单字段。

const [systems, setSystems] = useState<SystemProps[]>([]);
useEffect(() => {
api.get(`/systems?&order=description`).then((response) => {
setSystems(response.data.data);
});
}, []);

return (
<div className="col-sm-4">
<label>Sistema</label>
{systems.map(system => (
<SelectForm
key="id"
name="system_id"
id="system_id"
placeholder="Selecione"
options={[{ value: system.id, label: system.description }]}
/>
))}
</div>

看看重复的选择

标签： reactjs

Answer 1

我相信这就是您正在寻找的：

<label>Sistema</label>
<SelectForm
key="id"
name="system_id"
id="system_id"
placeholder="Selecione"
options={ systems.map(system => ({value: system.id, label: system.description })) }
/>

你想要map的选项，而不是整个表格。