React 中如何将数组数据渲染为 Ant Design Select 下拉框选项？

实现方法 #

你需要遍历List数组，将每个元素封装为Ant Design的<Option>组件后传入Select即可，注意要给每个<Option>添加唯一的key属性避免React渲染警告。

你可以直接把原来的Select部分替换为如下代码：

<Select {...selectProps}>
  {List.map(item => (
    <Option key={item} value={item}>
      {item}
    </Option>
  ))}
</Select>

补充说明 #

如果运行时报组件未定义的错误，请补全antd相关组件的导入语句：

import { Select, Row, Col, Form, Button, Divider } from "antd";

内容的提问来源于stack exchange，提问作者pram