react ant design select 动态生成选项

1.函数获取后端数据后修改state数据

2.代码块遍历state动态生成

注意:option中的key参数必须设置唯一的值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<Select showSearch
                style={<!-- -->{<!-- --> width: 200 }}
                placeholder="选择游戏"
                optionFilterProp="gameName"
                allowClear
                filterOption={<!-- -->(input, option: any) =>
                  option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
                }
                onFocus={<!-- -->getGameList}
        >
          {<!-- -->
            opt.gameList.map((item: any) => (
              <Option value={<!-- -->item.gameName} key={<!-- -->item.id}>{<!-- -->item.gameName}</Option>
            ))
          }
        </Select>