Material UI for React, also called MUI, does not come with a native Dropdown component. Here I want to share the dropdown component that I have used for several of my freelance projects when using Material UI. Before you can use it, you have to install its Material UI (MUI) dependencies:
Next follows the implementation of a Material UI Dropdown Component:
The usage of the MUI Dropdown compopnent looks as follows:
If you want to get to know a bit of the underlying implementation details:
If you want to get a nested dropdown menu for this dropdown component:
Optionally you can use the keepOpen property to not close the dropdown if one of its menu itemâs is clicked and the minWidth property to define a width for the dropdownâs menu. If you want to turn the dropdown component into a controlled component , you can pass it isOpen and onOpen props too.