search

carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.75k stars 1.8k forks source link

MultiSelect control selected items #9972

Closed ninjasun closed 2 years ago

ninjasun commented 2 years ago

Package

carbon-components-react

Browser

Chrome

Package version

7.40.1

Description

I am expecting to be able to control the component via props.

The reset button should clean the multiselect.

Also tested with 7.46.0

CodeSandbox example

https://codesandbox.io/s/carbon-components-react-forked-9mxge?file=/src/index.js

Steps to reproduce

select some items and click reset

Code of Conduct

joshblack commented 2 years ago

Hi there @ninjasun! 👋

For resetting uncontrolled components (like MultiSelect), you could use key. The "You Probably Don't Need Derived State" post talks about this approach over in: https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#recommendation-fully-uncontrolled-component-with-a-key

In practice, this would allow you to reset the state of the MultiSelect without having to control it's state.

Hope this helps!

ninjasun commented 2 years ago

thank @joshblack very appreciated. I made it work and I learned a new thing.

However, I think there should be a proper way to control it. like a prop. thanks again for the quick solution :)