具有搜索功能的 antd select 选项答案

【问题标题】：antd select option with search functionality具有搜索功能的 antd select 选项
【发布时间】：2021-06-26 08:14:33
【问题描述】：

我不知道这是否可能，但是当用户从选择选项中单击时，它将转到该特定 URL，我的意思是我们可以在“搜索...”中提供搜索功能，以便用户可以从数百个中搜索选项，然后选择它并单击按钮，该按钮也应转到相同的“onChange”地址。您还可以建议其他选项，即使没有选择但功能必须相同，这是我的代码：

import "antd/dist/antd.css";
import { Select } from "antd";
// import { Link, useHistory, useRouteMatch, useParams } from "react-router-dom";

function EventsSection() {
  // const history = useHistory();
  const { Option } = Select;

  // const changeHandler = (id) => {
  //   history.push(`/customer/${id}`);
  // };
  return (
    <div>
      {/* when found in search i want this button take to  'onChange' address also*/}
      <button>click me when found in search</button>
      <Select
        style={{ width: 200 }}
        placeholder="Search..."
        mode="multiple"
        open={true}
        listHeight={128}
        // onChange={changeHandler}
      >
        <Option value="1">Not Identified</Option>
        <Option value="2">Closed</Option>
        <Option value="3">Communicated</Option>
        <Option value="4">Identified</Option>
        <Option value="5">Resolved</Option>
        <Option value="6">Cancelled</Option>
      </Select>
    </div>
  );
}

export default EventsSection;

【问题讨论】：

你好，兄弟。但我没有正确满足您的要求。
那里写着“搜索...”用户应该能够搜索，例如通过写第一个字母 cl 它从该下拉菜单中获得“关闭”，然后可以单击该按钮，这应该将用户带到那个“onChange”
如上图所示
嘿@walee，你检查更新的答案了吗？
请重新检查。

标签： javascript html css reactjs antd

【解决方案1】：

第一部分已经完成。检查CodeSanbox。

第二部分我还不清楚。

正是这部分

然后可以单击该按钮，该按钮应将用户带到该按钮 'onChange'

【讨论】：

完成。请重新检查网址。
你能添加那个 div 吗？
请重新检查。
有一个关闭选项。而且你不能在不选择它的情况下按下按钮。检查控制台以获取选定的值和文本。
请点赞并将答案标记为已接受。