英文:
Adding new value to creatableselect on button click
问题
在按钮点击时向CreatableSelect添加新值。
我正在使用'react-select/creatable'中的CreatableSelect，并且我需要通过单击按钮来向选择字段添加新值，
例如：
并且我不想显示“创建文本”。
以下是我的代码：
<>
<CreatableSelect
isMulti
options={ options }
isClearable={false}
components={{
DropdownIndicator:() => null,
IndicatorSeparator:() => null
}}
/>
<span className="add-btn" onClick={handleCreateOption}>
<i className="bi bi-plus"></i>
</span>
</>
英文:
Adding new value to creatableselect on button click.
I am using CreatableSelect from 'react-select/creatable' , and I have to add new value to the select field by clicking on a button,
eg:
And I don't want to show the create "text".
here is my code
<>
<CreatableSelect
isMulti
options={ options }
isClearable={false}
components={{
DropdownIndicator:() => null,
IndicatorSeparator:() => null
}}
/>
<span className="add-btn" onClick={handleCreateOption}>
<i className="bi bi-plus"></i>
</span>
</>
答案1
得分: 1
对于特定情景，我认为不需要可创建的Select，而是可以使用一个简单的React Select，并在点击“添加”按钮时添加选项。您可能需要根据特定搜索条件来启用或禁用按钮，例如：
<button
disabled={
!!options.filter((option) =>
option.toLowerCase().includes(search.toLowerCase())
).length === 0
}
onClick={(e) => {
setOptions([...options, search]);
}}
>
添加
</button>
类似这样的实现。
英文:
for the specific scenario i don't think creatable Select is needed you use a simple react select and onClick of the add button add the option. you might need to enable and disable based on if no option is found with specific search.
like
<button
disabled={
!!option.filter((option) =>
option.toLowerCase().includes(search.toLowerCase())
).length
}
onClick={(e) => {
setOptions([...options, search])
}}
>
Add
</button>
something like this
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论