当前位置: 首页 > Web前端 > JavaScript

Antd组件问题:动态生成Select

时间:2023-03-27 10:17:58 JavaScript

遇到的问题总结最近在和老师做项目。在项目过程中,遇到了动态生成Select的一系列问题,针对解决方案做一个简单的记录。需求描述如下:后台获取的对象根据varName进行分类后,GenerateSelect根据不同的类别选择获取的数据,点击OK,合并为一个Obj,最后存入数组。遇到的问题如下:根据varName动态生成Select,显示不同的VarLables和VarItemLables点击OK后,Select显示的信息停留,无法更改。选择完成后,无法清除该值。然而,现实依旧是上次选择的数据。因此,如果您添加或选择完全相同的数据,则新添加的数据将为空。当我设置Value属性为固定值时,选择后,只会显示我设置的固定值,交互体验很差。当我参考网上的解决方案,将值设置为Undefined时,选择后只会显示placeholder属性的值。虽然点击成功了,但是用户是看不到的。这个时候我就在想为什么不设置一个状态数据,然后通过setState来控制Select值的显示呢,但是上面说了,我是动态生成多个Select的,所以一个值是不够我们控制显示的的价值。如果在动态生成的过程中,只设置一个Value,会导致每次点击一个Select,所以Select变成同一个值。解决方案我将选择