具有搜索功能的antd select选项 [英] antd select option with search functionality

问题描述

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

i dont know if this is possible but at the moment when user click from select options it will take to that specific url, my point is can we have search functionality in 'Search...' so user could search from hundreds of option and then choose it and click the button and that button should also take to that same 'onChange' address. You can also suggest other options, even without select but functionality must be same , here is my code:

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;

推荐答案

第一部分已完成.检查 CodeSanbox .

The first part is done. Check at CodeSanbox.

我仍然不清楚第二部分.

The second part is still unclear to me.

正是这部分

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

and then that button can be cliked which should take user to that ’onChange’

这篇关于具有搜索功能的antd select选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！