我有一个组合框,其中有多个选项,如执行、暂停、阻止等。用户可以选择其中任何一个,但默认情况下已经选择了一个名为“执行”的选项
当服务器启动时,数据来自后端让我们说例子被阻止, 我正在尝试将默认值从正在执行更新为已阻止,以便用户可以了解正在发送的服务器。
<Select size={"small"} className="mission-status">
<Option value="Executing">{missionStatusConts.MISSION_STATUS.EXECUTING}</Option>
<Option value="Completed">{missionStatusConts.MISSION_STATUS.COMPLETED}</Option>
<Option value="Blocked">{missionStatusConts.MISSION_STATUS.BLOCKED}</Option>
<Option value="Waiting">{missionStatusConts.MISSION_STATUS.WAITING}</Option>
<Option value="Offline">{missionStatusConts.MISSION_STATUS.OFFLINE}</Option>
<Option value="AllStop">{missionStatusConts.MISSION_STATUS.ALLSTOP}</Option>
</Select>
附上图片供引用
寻求快速帮助,我花了将近一天的时间在 antd 框架工作中完成它,但我无法完成..
感谢帮助
最佳答案
antd
的Select
标签有一个defaultValue
属性,可以用来显示初始值。
如果你想显示第二个选项,那么代码将是:
<Select defaultValue='Completed' size={"small"} className="mission-status">
<Option value="Executing">{missionStatusConts.MISSION_STATUS.EXECUTING}</Option>
<Option value="Completed">{missionStatusConts.MISSION_STATUS.COMPLETED}</Option>
<Option value="Blocked">{missionStatusConts.MISSION_STATUS.BLOCKED}</Option>
<Option value="Waiting">{missionStatusConts.MISSION_STATUS.WAITING}</Option>
<Option value="Offline">{missionStatusConts.MISSION_STATUS.OFFLINE}</Option>
<Option value="AllStop">{missionStatusConts.MISSION_STATUS.ALLSTOP}</Option>
</Select>
供您引用:Antd select api
关于reactjs - 如何使用 ant design 框架动态更新 Select Options 值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69437319/