React Dropdown component

Question

Can anybody suggest me a good React dropdown component, which is flexible and by flexible I mean that I want to draw more than just a list into the dropdown. Most of the components or actually all of them work i a way that one creates a react component...lets call it Dropdown and then give it some parameters like the default value, the list you want to render inside it and so on. But I want to create more to it. Pseudo example:

<Dropdown>
  <SelectedItem>
     Selected item value, that is always visible
  </SelectedItem>
  <List>
     <ListItem/>
     ...
     this is a scrollable part
  </List>
  <footer>
     Some epic stuff, that is outside of the list and is not part of
     the scrollable area
  </footer>
</Dropdown>

List and Footer would be in part of the dropdown which visibility is toggled.

Does anybody know a working component that can handle this functionality? Im really do not want to write this dropdown from scratch...Done it before with some angular/jquery mix and I have seen the bug count that may come with this... So I am hoping to find some component that has already solved those problems.

parecementeria · Accepted Answer · 2016-07-01 11:43:10Z

1

React-select (https://github.com/JedWatson/react-select) is a very flexible component for drop-downs. You can pass a function in some properties for rendering different parts of the dropdown: menuRenderer, valueRenderer and optionRenderer.

answered Jul 1, 2016 at 11:43

parecementeria

1051 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Kapaacius Over a year ago

I did try this and I actually somehow missed those rendered parts...This should hopefully do the trick.

Collectives™ on Stack Overflow

React Dropdown component

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related