Select2

  • In this method, selecting only one option from a lots of options while only using up as much space as a single option excepted. For more details
    • Installation
    npm i react-select
    A Basic Select
    Script
    import Select from 'react-select'

const Select2 = () => {
    const options = [
        { value: 'Alabama', label: 'Alabama' },
        { value: 'Amalapuram', label: 'Amalapuram'},
        { value: 'Arizona', label: 'Arizona' },
        { value: 'Colorada', label: 'Colorada' },
        { value: 'Idaho', label: 'Idaho' },
        { value: 'Montana', label: 'Montana' },
        { value: 'Alabama', label: 'Alabama' },
        { value: 'Anakapalli', label: 'Anakapalli' },
        { value: 'Akkayapalem', label: 'Akkayapalem' },
        { value: 'Nebraska', label: 'Nebraska' },
        { value: 'New Maxico', label: 'New Maxico' },
        { value: 'North Dakota', label: 'North Dakota' }
      ]
    return (
        <Select options={options} />
        )
    }
    A Multiple Choice
    Script
    import Select from 'react-select'

const Select2 = () => {
    const options = [
        { value: 'Alabama', label: 'Alabama' },
        { value: 'Amalapuram', label: 'Amalapuram'},
        { value: 'Arizona', label: 'Arizona' },
        { value: 'Colorada', label: 'Colorada' },
        { value: 'Idaho', label: 'Idaho' },
        { value: 'Montana', label: 'Montana' },
        { value: 'Alabama', label: 'Alabama' },
        { value: 'Anakapalli', label: 'Anakapalli' },
        { value: 'Akkayapalem', label: 'Akkayapalem' },
        { value: 'Nebraska', label: 'Nebraska' },
        { value: 'New Maxico', label: 'New Maxico' },
        { value: 'North Dakota', label: 'North Dakota' }
      ]
    return (
        <Select options={options} isMulti />
        )
    }
    Previous Next