我正在使用react-select库在我的项目中实现搜索和选择功能。
作为基本用法，我只能选择搜索后返回的选项。看起来像这样，其代码是：
<AsyncSelect
onChange={(item) => _selectedItemChange(item)}
loadOptions={loadItemOptions}
placeholder='Start typing'
/>
现在，我想在选择框的下端有一个按钮，这样我就可以像“未找到？添加新的'类型的东西。像这样的东西 。我还希望该按钮的 onClick 功能是我自己的。
我怎样才能做到这一点？
从@PasVV 的回答来看，我能够做出一些我想做的事情。通过将 props 传递给 AsyncSelect 组件，我们可以制作我们自己的自定义菜单（react-select 中的自定义组件），如下所示。
const CustomMenu = ({ innerRef, innerProps, isDisabled, children }) =>
!isDisabled ? (
<div ref={innerRef} {...innerProps} className="customReactSelectMenu">
{children}
<button
className="btn btn-info btn-sm btn-block"
onClick={() => ...}
>Add New</button>
</div>
) : null;
并将其传递给 <AsyncSelect/>
<AsyncSelect
onChange={_change}
loadOptions={loadVendorOptions}
placeholder='Start typing'
components={{ Menu: CustomMenu }}
/>
import { components } from 'react-select';
const SelectMenuButton = (props) => {
return (
<components.MenuList {...props}>
{props.children}
<button>Add new element</button>
</components.MenuList >
) }
<Select components={{ MenuList: SelectMenuButton }} />