So iam using multi select from react-select with redux-form with the onBlur hack(?) which is working fine behind the curtain because when i submit it I have the selected data in values
BUT after visiting any multi select field (even if i dont select anything) I end up with no values at all (nothing is displayed but this
))
const options = [
{ value: 'one', label: 'One' },
{ value: 'two', label: 'Two' }
];
<Select
value="one"
options={options}
multi={true}
{...input}
onBlur={() => {
input.onBlur({...input.value})
}
}
/>
So i end up with values in the redux state but I cant see any values in the field. Anyone know why is this happening?
Here's example how to make it works. react-select (1.0.0-rc.2), redux-form (5.3.4)
SelectInput.js
MyAwesomeComponent.js
I have not used more modern versions of
react-select
, but a year ago, there were some issues with having tosplit()
the string value by thedelimiter
to get the values as an array, and thenjoin()
them again to give to the component.Stuff like this:
I recommend examining exactly what the value is in Redux, using Redux DevTools, and what value prop is getting passed to
react-select
. I'm sure you'll find the problem in there.