couds / react-bulma-components

React components for Bulma framework
MIT License
1.2k stars 126 forks source link

<Select> element cannot be forced uncontrolled #329

Closed ruggi99 closed 3 years ago

ruggi99 commented 3 years ago

Hi all, I'm creating a demo page where I show the various form elements in a modal card. All these elements are uncontrolled inputs and it's wanted. All except <Select> where options cannot be changed without making a controlled input. EDIT: doesn't work in multiple mode or not

Looking at the code you are forcing the defaultValue if value isn't specified and the defaultValue cannot be specified.

I think forcing the value isn't good practise because the input will be controlled

https://github.com/couds/react-bulma-components/blob/ad9c351a4a7d3a4342834b7d487b86951bc56f3b/src/components/form/components/select.js#L28-L50

EDIT: Using value={null} makes the Select uncontrolled but React prints a warning about this:

Warning: You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.
    at select
    at Element
kennethnym commented 3 years ago

Can you explain a bit for your use case of needing an uncontrolled input?

ruggi99 commented 3 years ago

No particular use case from my side but it's the only controlled input in your library. In my demo page, as said above, I have to do state management for a value that I don't care

kennethnym commented 3 years ago

You should be able to use an empty string as the default value.

ruggi99 commented 3 years ago

<Form.Select defaultValue=""><options...></Form.Select> doesn't work

kennethnym commented 3 years ago

Will look into it.