h guys , I am making a react app with react select 1.3 version , I need to add a custom function to drop down which includes 2 keys. I noticed latest react select has a function for this
getOptionLabel
I want to find something similar to this function for react select version 1.3 . could anyone able to help me on this ?
this is not supported in react select version 1.3 need a function similar to this
getOptionLabel={(option) => `${option.label}: ${option.rating}`}
Advertisement
Answer
You can relabel the options by mapping the original options array to a new one, like this:
const options = colourOptions.map(({ value, label, color }) => ({ value, label: `${value}: ${label}, ${color}` }));
Since the custom <select>
is now using new objects, you need to make a change to handleChange
so the original options are used in the state:
handleChange = (alteredOptions) => { // map altered options to actual options using the value const selectedOptions = alteredOptions.map((so) => colourOptions.find((co) => co.value === so.value) ); this.setState({ selectedOptions }); };