When using multi select , the drop down shows No-Options after selecting a value

In Multi-Select version, when a value is selected, nothing shows in the drop down. I see No Options. When no value is selected, I see some options. My code is straight from the docs:

import Select from 'react-select';
import { colourOptions } from './data';

class Search extends React.Component {
   
    render(){
        return (
            <Select
                defaultValue={[colourOptions[2], colourOptions[3]]}
                isMulti
                name="colors"
                options={colourOptions}
                className="basic-multi-select"
                classNamePrefix="select"
            />
        );
        
    }
}

export default Search
 

[xnart]

Check if your colourOptions similar as this :

export const colourOptions = [
  { value: 'ocean', label: 'Ocean },
  { value: 'blue', label: 'Blue' }
];

An option must have value key.

[williamluke4]

@xnart Is correct either ensure that all options have a value key or use the getOptionValue prop