一、背景:
业务反馈了一个线上bug:下拉框的选项与接口实际返回的值不一样。
二、排查
1、查看控制台:
发现报错:’有两个子节点的key是相同的‘,而重复的key值,是sug接口所返回对象的companyName属性值。
2、查看组件代码:
发现在options对象中,并没有key属性,而且只有value属性是直接使用了companyName
那么可以推测,在antd Select组件中,当option没有设置key属性时,select组件会自动取value值做为每个option的key。
3、查看源码
发现和推测的一样
三、解决办法:
给option对象设置一个唯一key,即可解决渲染错乱的问题。