react-functional-select
react-functional-select copied to clipboard
initialValue prop not working?
Hi, I have initialValue set and it's not using it.
<Select
initialValue={maxPlayers}
options={[1, 2, 3, 4, 5, 6, 7, 8]}
onOptionChange={setMaxPlayers}
getOptionValue={opt => opt}
getOptionLabel={opt => opt}
/>
I even hard-coded it to initialValue={2}
without success. Am I doing something wrong?
Okay, by examining the source code I found that this prop is passed through a call to normalizeValue
, and that if it isn't an array or a plain object it returns an empty array here. Not sure if this is a bug or intended, but it seems like a bug since the documentation says type: any
for this prop.
Putting the passed prop value in an array resolves the issue, but this seems like it might merit a fix. Since initialValue
is rather integral to many form inputs I'm somewhat surprised to find this bug at all. Can't imagine how nobody ran into it before.
I found a second issue with this, although this time I'm less sure what can be done about it. Because the dropdown has an initialValue
prop but no value
prop, programmatically updating the state value the dropdown is associated with doesn't update the dropdown itself. It can only be updated by the user manually changing it.
So if I want to change the dropdown's value in response to a separate user action, there doesn't seem to be a way to do so. Is there a way to do this?
Edit: I found that I can do this using a ref and the prescribed API, although this feels a bit hacky.
I miss the value
prop. In my case, the ref.current.setValue
is in useEffect
and depends on a prop (an array of strings). When I set isMulti=true
I get an inifity loop.
I tried to set intialValue
or defaultValue
and the input is not refreshed, but the component state is updated according to the Chrome Dev Tools.