How to disable input on react-select?

Viewed 10828

How to disable input on react-select? Is that possible? I just want it to be a dropdown.

<Select
    placeholder="Action"
    className="col-3 mt-3"
    value={orderStatusInput}
    onChange={this.onOrderStatusChange}
    options={orderStatusOptions}
/>

enter image description here

3 Answers

To make React Select act as a dropdown

export default function App() {
  return (
    <div>
      <ReactSelect isSearchable={false} />
    </div>
  );
}

If you want the search input to be disabled and just want it to be a dropdown, you can set the isSearchable property to false:

<Select
  placeholder="Action"
  className="col-3 mt-3"
  value={orderStatusInput}
  onChange={this.onOrderStatusChange}
  options={orderStatusOptions}
  isSearchable={false}
/>
Related