React-select - Is there a way to load values only on typing the characters

Question

The default behaviour of react-select is to load all the values from the state just on clicking over the field. But the desired field is to load the values only on typing the character(s). Is there any api available to achive this?

Answer 1

You need openMenuOnClick prop: https://codesandbox.io/s/lp9yz26y4q

Code from link:

import React from "react";
import ReactDOM from "react-dom";
import Select from "react-select";

function App() {
  return (
    <div className="App">
      <Select
        openMenuOnClick={false}
        options={[
          { label: "option1" },
          { label: "option2" },
          { label: "option3" }
        ]}
      />
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);