MenuItem

The MenuItem component represents an item in a menu.

NOTE

This component is supported since API version 9. Newly added APIs will be marked with a superscript to indicate their earliest API version.

Child Components

Not supported

APIs

MenuItem(value?: MenuItemOptions|CustomBuilder)

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
value	MenuItemOptions \|CustomBuilder	No	Information about the menu item.

MenuItemOptions

System capability: SystemCapability.ArkUI.ArkUI.Full

Name	Type	Mandatory	Description
startIcon	ResourceStr	No	Path to the icon displayed on the left of the menu item. Atomic service API: This API can be used in atomic services since API version 11.
content	ResourceStr	No	Content of the menu item. Atomic service API: This API can be used in atomic services since API version 11.
endIcon	ResourceStr	No	Path to the icon displayed on the right of the menu item. Atomic service API: This API can be used in atomic services since API version 11.
labelInfo	ResourceStr	No	Information about the ending label, for example, shortcut Ctrl+C. Atomic service API: This API can be used in atomic services since API version 11.
builder	CustomBuilder	No	Builder for a level-2 menu. Atomic service API: This API can be used in atomic services since API version 11.
symbolStartIcon¹²⁺	SymbolGlyphModifier	No	Path to the symbol icon displayed on the left of the menu item. When this parameter is set, the icon set through startIcon is not displayed. Atomic service API: This API can be used in atomic services since API version 12.
symbolEndIcon¹²⁺	SymbolGlyphModifier	No	Path to the symbol icon displayed on the right of the menu item. When this parameter is set, the icon set through endIcon is not displayed. Atomic service API: This API can be used in atomic services since API version 12.

Attributes

In addition to the universal attributes, the following attributes are supported.

selected

selected(value: boolean)

Sets whether the menu item is selected.

Since API version 10, this attribute supports two-way binding through $$. Since API version 18, this attribute supports two-way binding through !!.

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
value	boolean	Yes	Whether the menu item is selected. Default value: false true: The menu item is selected. false: The menu item is not selected.

selectIcon

selectIcon(value: boolean|ResourceStr|SymbolGlyphModifier)

Sets whether to display the selected icon when the menu item is selected.

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
value	boolean \|ResourceStr¹⁰⁺\|SymbolGlyphModifier¹²⁺	Yes	Whether to display the selected icon when the menu item is selected. Default value: false true: When the menu item is selected, the default tick icon is displayed. false: When the menu item is selected, no icon is displayed. ResourceStr: When the menu item is selected, the specified icon is displayed. SymbolGlyphModifier: When the menu item is selected, the specified symbol icon is displayed.

contentFont¹⁰⁺

contentFont(value: Font)

Sets the font style of the menu item content.

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
value	Font	Yes	Font style of the menu item content.

contentFontColor¹⁰⁺

contentFontColor(value: ResourceColor)

Sets the font color of the menu item content.

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
value	ResourceColor	Yes	Font color of the menu item content. Default value: '#E5000000'

labelFont¹⁰⁺

labelFont(value: Font)

Sets the font style of the menu item label.

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
value	Font	Yes	Font style of the menu item label.

labelFontColor¹⁰⁺

labelFontColor(value: ResourceColor)

Sets the font color of the menu item label.

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
value	ResourceColor	Yes	Font color of the menu item label. Default value: '#99000000'

Events

onChange

onChange(callback: (selected: boolean) => void)

Triggered when the selection status of the menu item is changed manually.

Atomic service API: This API can be used in atomic services since API version 11.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name	Type	Mandatory	Description
selected	boolean	Yes	Invoked when the selected status changes. If the return value is true, the menu item is selected. If the return value is false, the menu item is not selected.