Select example in React.js

Reference:

https://react-select.com/home

https://www.npmjs.com/package/react-select 

https://pretagteam.com/question/how-to-pass-props-to-custom-components-in-reactselect

example 

                                    <div className="col-2 text-left form-group">
                                        <Select
                                            id="searchYear"
                                            name="searchYear"
                                            closeMenuOnSelect={true}
                                            components={this.props.animatedComponents}
                                            onChange={value => this.props.setSearchYear( value.value )}
                                            options={this.props.yearList}
                                            defaultValue={[{ label: 'All Fiscal Years', value: 0 }]}
                                        />
                                    </div>
"options" is for dropdown menu.

About components props

import makeAnimated from 'react-select/lib/animated';

const colourOptions = [] 
class App extends React.Component {
  render(){
    return (
      <Select
        className="mt-4 col-md-6 col-offset-4"
        components={makeAnimated()}
        isMulti
        options={colourOptions}
        />
    );
  }
}

export default App;