Items
The Menu items provide configuration options for their text, descriptions, URLs, icons, styles, and behavior.
To render the Menu items, either:
To customize item content beyond these built-in options, see Menu Item Customization.
Setting Text
You can set the text of the Menu items by using the text property.
Setting Descriptions
To display secondary text below an item label, set the description property. You can configure descriptions on nested MenuItem components or on objects passed to the Menu's items property.
The Menu does not automatically display descriptions when an item renderer (render or itemRender) or a linkRender replaces the default content. Include item.description in your custom renderer if needed.
The following example adds descriptions to the order workspace's Details and Activity menus. Open Order to explore them.
Rendering URLs
You can set the URL of the items by using the url property. The URL will be rendered as a href attribute on the item link.
Disabling Items
You can specify that a Menu item is disabled by using the disabled property.
Showing Separator Items
You can specify a separator item by using the separator property.
Defining Group Headers
To display a non-interactive label above related items, set the groupHeader property to true. Place the header and its related items as siblings inside a submenu.
<Menu>
<MenuItem text="Reports">
<MenuItem text="Sales" groupHeader={true} />
<MenuItem text="Daily revenue" />
<MenuItem text="Monthly revenue" />
</MenuItem>
</Menu>
By default, a group header displays its text and optional icon. To customize its content, use a group header renderer.
The following example organizes a commerce dashboard's sales, inventory, and fulfillment reports under group headers. Open a department menu to see how headers label related reports.
Displaying Icons
You can specify the name of a font icon that will be rendered for the item by using the icon property.
Adding Styles and Classes
You can set styles and classes to the items by using the cssStyle and cssClass properties.