anchor is the anchor position or position where we want to show the menu. This value is set when we click on the button. It opens the menu at the button position.
options are menu item values that we need to show. We are using map to show all menu items.
selected is the index of the current selected menu item.
openMenu and closeMenu methods are called when the menu will open and close. openMenu is called on clicking the button. closeMenu is called if we click on anywhere else on the screen. It will hide the menu.
onMenuItemClick is called on clicking any menu item.
If you run this, it will show one button, on clicking that button it will show the menu:
Maximum height and width of a menu:
We can assign the maximum height and width of a menu. It will create the menu scrollable. For that, we need to give the style in PaperProps props:
Changing the animation of menu appearing:
We can change the appear/disappear animations of a menu by providing a props called TransitionComponent. We can use predefined transitions like Grow, Slide, Fade, Zoom as like below: