Bugs on Listbox for Multiselect when states & handlers are passed from props #3151
Unanswered
nriin-marifin
asked this question in
Help
Replies: 1 comment 1 reply
-
Hey! The issue you are seeing is that you are defining your This means that all your objects are new instances and we don't know which one is selected because comparing them using There are a few solutions to this problem:
In Headless UI v2 we will automatically compare by the Hope this helps! |
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
What package within Headless UI are you using?
@headlessui/react
What version of that package are you using?
v1.7.19
What browser are you using?
Chrome
Reproduction URL
Stackblitz Repro
Describe your issue
There is a bug with selection handler if I define a
listbox
withmultiple
flag with states & state handlers passed fromprops
. It works okay if I define theoptions
,selected
&handleSelect
on the component, but it doesn't work when I refactor the component into a reusable one with props. Basically, every selected items will always get reselected & didn't get tracked as selected element.This component works. This is where I define everything inside of the reusable component:
When I define the state & handlers from props, it doesn't work. Every selected items will get reselected again and again with no limits. This is very weird.
Beta Was this translation helpful? Give feedback.
All reactions