But when I use dynamic options (fetch, createResource, promise, etc), something goes wrong. There are main problems:
Chosen Option does not change Select value
onChange handler always receives similar value
More than two Select changes cause console errors:
MUI: A component is changing the uncontrolled value state of Select to be controlled.
Elements should not switch from uncontrolled to controlled (or vice versa).
Decide between using a controlled or uncontrolled Select element for the lifetime of the component.
The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.
I tried to:
Set a defaultValue to Select;
Set a defaultValue to createSignal;
Set a tabIndex, because I noticed that in For each MenuItem has tabIndex=-1
What my expectations are:
I should be able to choose any option from the Select
There is a playground placed on stackblitz.
I am using SolidJS and SUID ( Solid material UI ) library.
I am trying to use the same example as in the SUID documentation. https://suid.io/components/select
In this case, the Options that have values like any, option1 and option2 (static options) are selectable, but other are not.
Also I should mention, when I use static options (code below) a Select works fine.
But when I use dynamic options (fetch, createResource, promise, etc), something goes wrong. There are main problems:
I tried to:
What my expectations are:
There is a playground placed on stackblitz.
I described an issue on stackoverflow as well.
Screencast from 09-04-2023 08:37:38 PM.webm