1# MenuItem
2
3用来展示菜单Menu中具体的item菜单项。
4
5> **说明：**
6>
7> 该组件从API Version 9开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
8
9## 子组件
10
11无
12
13## 接口
14
15MenuItem(value?: MenuItemOptions| CustomBuilder)
16
17**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
18
19**系统能力：** SystemCapability.ArkUI.ArkUI.Full
20
21**参数：**
22
23| 参数名 | 类型                                                         | 必填 | 说明                         |
24| ------ | ------------------------------------------------------------ | ---- | ---------------------------- |
25| value  | [MenuItemOptions](#menuitemoptions对象说明) \| [CustomBuilder](ts-types.md#custombuilder8) | 否   | 包含设置MenuItem的各项信息。 |
26
27## MenuItemOptions对象说明
28
29**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
30
31**系统能力：** SystemCapability.ArkUI.ArkUI.Full
32
33| 名称      | 类型                                        | 必填 | 说明                             |
34| --------- | ------------------------------------------- | ---- | -------------------------------------- |
35| startIcon | [ResourceStr](ts-types.md#resourcestr)      | 否   | item中显示在左侧的图标信息路径。       |
36| content   | [ResourceStr](ts-types.md#resourcestr)      | 否   | item的内容信息。                       |
37| endIcon   | [ResourceStr](ts-types.md#resourcestr)      | 否   | item中显示在右侧的图标信息路径。       |
38| labelInfo | [ResourceStr](ts-types.md#resourcestr)      | 否   | 定义结束标签信息，如快捷方式Ctrl+C等。 |
39| builder   | [CustomBuilder](ts-types.md#custombuilder8) | 否   | 用于构建二级菜单。                     |
40| symbolStartIcon<sup>12+</sup>   | [SymbolGlyphModifier](ts-universal-attributes-attribute-modifier.md) | 否   | item中显示在左侧的HMSymbol图标信息路径。配置该项时，原先startIcon图标不显示。<br/>**原子化服务API：** 从API version 12开始，该接口支持在原子化服务中使用。|
41| symbolEndIcon<sup>12+</sup>   | [SymbolGlyphModifier](ts-universal-attributes-attribute-modifier.md) | 否   | item中显示在右侧的HMSymbol图标信息路径。配置该项时，原先endIcon图标不显示。<br/>**原子化服务API：** 从API version 12开始，该接口支持在原子化服务中使用。|
42
43
44## 属性
45
46除支持[通用属性](ts-universal-attributes-size.md)外，还支持以下属性：
47
48### selected
49
50selected(value: boolean)
51
52设置菜单项是否选中。
53
54从API version 10开始，该参数支持[$$](../../../quick-start/arkts-two-way-sync.md)双向绑定变量。
55
56**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
57
58**系统能力：** SystemCapability.ArkUI.ArkUI.Full
59
60**参数：**
61
62| 参数名 | 类型    | 必填 | 说明                                |
63| ------ | ------- | ---- | ----------------------------------- |
64| value  | boolean | 是   | 菜单项是否选中。<br />默认值：false |
65
66### selectIcon
67
68selectIcon(value: boolean | ResourceStr | SymbolGlyphModifier)
69
70设置当菜单项被选中时，是否显示被选中的图标。
71
72**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
73
74**系统能力：** SystemCapability.ArkUI.ArkUI.Full
75
76**参数：**
77
78| 参数名 | 类型                                                         | 必填 | 说明                                                         |
79| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
80| value  | boolean&nbsp;\|&nbsp;[ResourceStr](ts-types.md#resourcestr)<sup>10+</sup>\|&nbsp;[SymbolGlyphModifier](ts-universal-attributes-attribute-modifier.md)<sup>12+</sup> | 是   | 菜单项被选中时，是否显示被选中的图标。<br/>默认值：false<br/>true: 菜单项被选中时，显示默认的对勾图标<br/>false: 即使菜单项被选中也不显示图标<br/>ResourceStr: 菜单项被选中时，显示指定的图标<br/>SymbolGlyphModifier: 菜单项被选中时，显示指定的HMSymbol图标。 |
81### contentFont<sup>10+</sup>
82
83contentFont(value: Font)
84
85设置菜单项中内容信息的字体样式。
86
87**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
88
89**系统能力：** SystemCapability.ArkUI.ArkUI.Full
90
91**参数：**
92
93| 参数名 | 类型                     | 必填 | 说明                         |
94| ------ | ------------------------ | ---- | ---------------------------- |
95| value  | [Font](ts-types.md#font) | 是   | 菜单项中内容信息的字体样式。 |
96
97### contentFontColor<sup>10+</sup>
98
99contentFontColor(value: ResourceColor)
100
101设置菜单项中内容信息的字体颜色。
102
103**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
104
105**系统能力：** SystemCapability.ArkUI.ArkUI.Full
106
107**参数：**
108
109| 参数名 | 类型                                       | 必填 | 说明                         |
110| ------ | ------------------------------------------ | ---- | ---------------------------- |
111| value  | [ResourceColor](ts-types.md#resourcecolor) | 是   | 菜单项中内容信息的字体颜色。<br />默认值：'#E5000000' |
112
113### labelFont<sup>10+</sup>
114
115labelFont(value: Font)
116
117设置菜单项中标签信息的字体样式。
118
119**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
120
121**系统能力：** SystemCapability.ArkUI.ArkUI.Full
122
123**参数：**
124
125| 参数名 | 类型                     | 必填 | 说明                         |
126| ------ | ------------------------ | ---- | ---------------------------- |
127| value  | [Font](ts-types.md#font) | 是   | 菜单项中标签信息的字体样式。 |
128
129### labelFontColor<sup>10+</sup>
130
131labelFontColor(value: ResourceColor)
132
133设置菜单项中标签信息的字体颜色。
134
135**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
136
137**系统能力：** SystemCapability.ArkUI.ArkUI.Full
138
139**参数：**
140
141| 参数名 | 类型                                       | 必填 | 说明                         |
142| ------ | ------------------------------------------ | ---- | ---------------------------- |
143| value  | [ResourceColor](ts-types.md#resourcecolor) | 是   | 菜单项中标签信息的字体颜色。<br />默认值：'#99000000' |
144
145## 事件
146
147### onChange
148
149onChange(callback: (selected: boolean) => void)
150
151当选中状态发生变化时，触发该回调。只有手动触发且MenuItem状态改变时才会触发onChange回调。
152
153**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
154
155**系统能力：** SystemCapability.ArkUI.ArkUI.Full
156
157**参数：**
158
159| 参数名   | 类型    | 必填 | 说明                                                         |
160| -------- | ------- | ---- | ------------------------------------------------------------ |
161| selected | boolean | 是   | 选中状态发生变化时，触发该回调。<br />返回值为true时，表示已选中，为false时，表示未选中。 |
162
163## 示例
164
165详见[Menu组件示例](ts-basic-components-menu.md#示例)。
166