question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Multiselect dropdown with loadOptions doesn't allow selecting

See original GitHub issue

If a dropdown is set to multi and the options are loaded through a promise with loadOptions, the component gets re-rendered anytime you select an option. This causes the inability to select anything.

@Hyperkid123

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:10 (10 by maintainers)

github_iconTop GitHub Comments

1reaction
Hyperkid123commented, Dec 16, 2019

@skateman ok so the issue is in the React.cloneElement part which is used when passing children to custom component. Problem is that the component is re-mounted not updated which causes the value and promise to reset.

To fix it you have two options:

 <FieldProvider {...rest} render={props => <RawTagControl {...props} /> }>

 <FieldProvider {...rest} component={RawTagControl} />

Let us know if this fixes the issue with re-mounting

I am not 100% sure what is the cause, but this worked for me. @rvsia We should add to the docs that using the component prop is the n.o 1 option and render is the n.o 2.

0reactions
skatemancommented, Dec 18, 2019

It works, thank you!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Async Multiselect, options dropdown hides every time ... - GitHub
In Async Multiselect (Select.Async), if multi-select is true then options dropdown hides every time an option selected. To see the dropdown ...
Read more >
React-Select Async loadOptions is not loading options properly
React Async Select loadoption sometimes fail to loads the option. This is a very strange phenomenon after couple of set of queries react ......
Read more >
Async - React Select
A flexible and beautiful Select Input control for ReactJS with multiselect, autocomplete and ajax support.
Read more >
Select - Examples - Components - Atlassian Design System
Multi select ​​ Allows the user to select multiple items from a dropdown list of options. What cities have you lived in?
Read more >
Should selected options be removed from single- and multi ...
Currently the multi-select closes when the user clicks outside of the dropdown list, it does not close when selecting an option. For our...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found