react-select-search does not allow me to select multiple values

793 Views Asked by At

I cannot select multiple values without holding Cmd key

My usage of SelectSearch in the component

<SelectSearch search multiple emptyMessage="Cannot find class" options={this.state.lessonSelections}
placeholder="Class" closeOnSelect={false} printOptions="on-focus"
className='select-search' onChange={this.handleLessonsChange.bind(this)} /> 

My handleLessonsChange

handleLessonsChange(value, state, props) {
    this.setState({
      lessons: state
    });
  }

and then the state

this.state = {
      studentSelections: [],
      lessonSelections: [],
      materialSelections: [],
      student: '',
      lessons: [],
      materials: [],
      data: {},
    };

I'm just lost on how I can select multiple values like how it is in the storybook

1

There are 1 best solutions below

1
On

Try to set multiple option to true, it's in the docs https://www.npmjs.com/package/react-select-search. Like this:

export default function App() {
  const options = [
    { name: "Swedish", value: "sv" },
    { name: "English", value: "en" },
    { name: "Spanish", value: "sp" }
  ];

  return (
    <div className="App">
      <SelectSearch
        options={options}
        value="sv"
        name="language"
        placeholder="Choose your language"
        multiple="true"
      />
    </div>
  );
}