gluestack

gluestack Logogluestack

Select: make a change in `selectedValue` reflect the correct label

mderriey posted this in #support
Open in Discord
Avatar
mderrieyOP
Hi,

We're using <Select> in controlled mode, and conditionally want to select a default value, which we do via selectedValue and initialLabel as per the docs.
While the data is loading, we're giving react-hook-form a default value of {value: '', label: ''}, which are passed respectively to selectedValue and initialLabel.

When the data is loaded, the label reflects the value instead of the label associated with it.
It seems initialLabel is cached with useState, and programmatic changes to selectedValue don't set the right label.

The current workaround is to have a sentinel value which we detect to prevent the initial render of the <Select> if we know a default value will come later.
Not pretty...

Any chance this could be looked at?
Thanks!

1 Reply