使 Select 上的标签可编辑答案

【问题标题】：Make tags on Select editable使 Select 上的标签可编辑
【发布时间】：2020-11-21 10:54:54
【问题描述】：

我正在使用Tag 模式在我的React 应用程序中使用antd 设计中的Select 组件，并且我希望Select 中的标签在用户双击它时是可编辑的

知道我该怎么做吗？

这是目前为止的代码：

<Select
     showSearch={false}
     mode="tags"
     onChange={handleChange}
     tokenSeparators={[',']}
     value={Tags}
 >
     {children}
</Select>

【问题讨论】：

让它们可编辑有什么意义？他们可以按退格键并输入新标签
这是一个要求，他们希望用户能够修复标签上的任何错误，而不是删除它并重新编写
哈客户要求，从来没有意义 XD

标签： reactjs frontend antd

【解决方案1】：

查看 React 合成事件：https://reactjs.org/docs/events.html#mouse-events

<option onDoubleClick={yourFunctionForDoubleClick} value={option.value}>{option.label}</option>

yourFunctionForDoubleClick =(event)=> { your logic here, then setState({yourState: event.target.value})}

【讨论】：

感谢您的回复，但此双击将用于选项本身而不是标签！ “选定的选项”