在反应选择的选项末尾添加一个按钮

2024-01-09

我在用反应选择 https://github.com/JedWatson/react-select库在我的项目中实现搜索和选择功能。

作为基本用法,我只能选择搜索后返回的选项。看起来像this https://i.stack.imgur.com/m9RTF.png其代码是:

<AsyncSelect
       onChange={(item) => _selectedItemChange(item)}
       loadOptions={loadItemOptions}
       placeholder='Start typing'
 />

现在,我想要在选择框的下端有一个按钮,以便我可以执行“未找到?”之类的操作。添加“新”类型的东西。就像是this https://i.stack.imgur.com/WRFd8.png。我还希望该按钮的 onClick 函数是我自己的。

我怎样才能做到这一点?


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 }} />
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在反应选择的选项末尾添加一个按钮 的相关文章

随机推荐

  • 推特引导程序中缩小尺寸?

    当 在我的浏览器中 我缩小两次 ctrl ctrl 而不是默认的 使用 ctrl 0 查看时 我喜欢使用 twitter bootstrap 的所有项目的大小 缩放会影响字体大小 响应式设计以及我想使用 bootstrap 的其他十几个重要
  • 如何允许 UWP ListView 滚动到最后一项?

    我有一个 ListView 其中包含一堆大小不规则的项目 当您滚动 ListView 时 最后一项的底部将最终位于控件的底部 您无法继续滚动 如果最后一项小于控件 我想要top最后一个项目能够滚动到控件的顶部 如果该项目比控件大 我对默认行
  • Rails 3.2.6 和通过迁移创建数据库视图

    我使用的是 Rails 3 2 6 我需要创建一个数据库 VIEW 像往常一样 我创建了一个迁移 并尝试使用执行方法来实现目标 不幸的是 迁移生成的是表 而不是视图 为什么 提前谢谢了 毛罗 UPDATE 我想要如下的东西 class Cr
  • C# 中 Delphi“shl”的等价物是什么?

    我正在基于 Delphi 转换代码 用 C 制作一个应用程序 但我发现了一个我不认识的命令 shl 我想知道是否有与 C 等效的命令 提前致谢 Shl is 左移 http www delphibasics co uk RTL asp Na
  • 如何静态检测缺失的 @Override 注释?

    在 Java 5 和 Java 6 之间 有关的规则 Override源自接口 而不是超类 的方法的注释已更改 在不允许之前 但在允许之后 然而 他们并不是required通过javac 某些 IDE 例如 eclipse 可能会针对此类缺
  • 为什么 constexpr 不是所有函数的默认值? [复制]

    这个问题在这里已经有答案了 在放宽 constexpr 的规则后 这些函数似乎可以在任何地方使用 它们也可以在常量 constexpr 和局部 可变 变量上调用 所以对我来说 这似乎只是编译器的提示 如内联 我只是继续在各处编写它 如果编译
  • ASP.NET Core 应用程序的解决方案资源管理器中的文件嵌套

    当我创建 ASP NET Core 2 0 Razor Page 模板项目时 每个 cshtml 及其 cs 文件都被拆分 我不知道为什么 几分钟前它工作正常 但我不记得我做了什么 也许是 SDK 或 Visual Studio 的设置 我
  • 语法:自上而下和自下而上的区别?

    自上而下和自下而上语法有什么区别 举个例子就太好了 首先 语法本身不是自上而下或自下而上的 parser是 尽管有些语法可以被一种语法解析 但不能被另一种语法解析 从实践的角度来看 主要区别在于大多数手写解析器是自上而下的 而更大比例的机器
  • 查找资源字典时出现设计时错误 - 项目之间不一致

    TLDR 新引用外部的屏幕ResourceDictionary在运行时可以正确地以 VS2015 样式编写文件 但在设计时则不然 是什么赋予了 在工作中 我们有一个 WinForms 产品 其中包含manyWinForms 屏幕上有一位开发
  • std::shared_ptr 向上转换为基类 - 最好的方法?

    哪种转换更好 有什么区别 class Base class Derived public Base public std enable shared from this
  • 如何解决 Spark 上的纱线容器尺寸问题?

    我想启动一些 pyspark 作业YARN 我有 2 个节点 每个节点 10 GB 我可以像这样打开 pyspark shell pyspark 现在 当我有一个非常简单的示例时 我尝试启动 import random NUM SAMPLE
  • 如何避免ie8兼容按钮?

    在IE8中 微软引入了一种称为兼容模式的新模式 它可以像IE7一样呈现页面 您可以在 stackoverflow com 中的地址栏旁边看到此按钮 但是当您访问google com live com时 您将看不到兼容模式按钮 我们如何确保页
  • 使用 HttpUrlConnection 访问 Tomcat 时为 404,从浏览器访问时为 200

    我遇到了最奇怪的 Tomcat 错误 我有一个使用 tomcat 在本地主机的端口 8080 上运行的 Web 应用程序 一切似乎都运行良好 没有错误等 但是 当我尝试使用 HttpURLConnection 类从另一个应用程序访问此 We
  • 推送包含文档和文件的集合时出现 JSONStore 错误

    我有一个用于客户列表的 JSONStore 用户可以使用该应用程序向这些客户添加文档 客户列表及其数据 以及附加文档 必须与后端同步 当我将 774KB 的 ppt 文档 即二进制大小 我将其转换为 base64 添加到 json 存储并执
  • 如何使用 Windows shell 获取文件扩展名的大图标?

    我发现了各种有关获取文件甚至文件扩展名的系统映像的文章 我有以下方法可用于获取小型 16x16 和大型 32x32 图像 DLL Import DllImport shell32 private static extern IntPtr S
  • mPDF - 渲染后确定元素的高度

    我正在使用 mPDF 从表单提交生成 PDF 文件 该脚本将遍历所有问题并为每个包含问题和答案的 HTML 字段集创建一个 HTML 字段集 由于调查相当长 生成的 PDF 跨越多个页面 效果很好 现在 客户想要 漂亮且漂亮 的 PDF 文
  • 如何使用 NestJS 重新抛出 HttpService 调用的错误?

    我使用 NestJS 本质上是使用以下方法将请求代理到另一个 apiHttpService 一个可观察的包装的 Axios 库 例如 return this httpService post pipe map response gt res
  • 在 C# 中,如何使用反射访问大括号构造函数?

    在 C 中 我们现在可以使用大括号构造函数构造新对象 即 class Person readonly string FirstName get set readonly string LastName get set new Person
  • 以编程方式修改 Windows Server 2008 R2 中的防火墙规则

    我希望能够以编程方式在 Windows Server 2008 R2 中启用 禁用和创建防火墙规则 从 Net PowerShell 修改防火墙规则的对象模型是什么 可能有一组 WMI 类用于此目的 但我想指出您可以使用 PowerShel
  • 在反应选择的选项末尾添加一个按钮

    我在用反应选择 https github com JedWatson react select库在我的项目中实现搜索和选择功能 作为基本用法 我只能选择搜索后返回的选项 看起来像this https i stack imgur com m9