1# SubHeader 2<!--Kit: ArkUI--> 3<!--Subsystem: ArkUI--> 4<!--Owner: @fengluochenai--> 5<!--Designer: @YanSanzo--> 6<!--Tester: @tinygreyy--> 7<!--Adviser: @HelloCrease--> 8 9 10子标题,用于列表项顶部,将该组列表划分为一个区块,子标题名称用来概括该区块内容。也可以用于内容项顶部,子标题名称用来概括该区块内容。 11 12 13> **说明:** 14> 15> 该组件从API version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 16> 17 18 19## 导入模块 20 21```ts 22import { SubHeader } from '@kit.ArkUI'; 23``` 24 25 26## 子组件 27 28无 29 30## 属性 31 32不支持[通用属性](ts-component-general-attributes.md)。 33 34> **说明:** 35> 36> 不支持设置文本相关。 37 38## SubHeader 39 40SubHeader({icon?: ResourceStr, iconSymbolOptions?: SymbolOptions, primaryTitle?: ResourceStr, secondaryTitle?: 41ResourceStr, select?: SelectOptions, operationType?: OperationType, operationItem?: Array<OperationOption>, 42operationSymbolOptions?: Array<SymbolOptions>, primaryTitleModifier?: TextModifier, secondaryTitleModifier?: 43TextModifier, titleBuilder?: () => void, contentMargin?: LocalizedMargin, contentPadding?: LocalizedPadding}) 44 45**装饰器类型:**\@Component 46 47**系统能力:** SystemCapability.ArkUI.ArkUI.Full 48 49**设备行为差异:** 该接口在Wearable设备上使用时,应用程序运行异常, 异常信息中提示接口未定义,在其他设备中可正常调用。 50 51| 名称 | 类型 | 必填 | 装饰器类型 | 说明 | 52| -------- | -------- | -------- |---------------| -------- | 53| icon | [ResourceStr](ts-types.md#resourcestr) | 否 | \@Prop | 图标设置项。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 54| iconSymbolOptions<sup>12+</sup> | [SymbolOptions](#symboloptions12) | 否 | - | icon为[SymbolGlyph](ts-basic-components-symbolGlyph.md)时的设置项。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 55| primaryTitle | [ResourceStr](ts-types.md#resourcestr) | 否 | \@Prop | 标题内容。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 56| secondaryTitle | [ResourceStr](ts-types.md#resourcestr) | 否 | \@Prop | 副标题内容。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 57| select | [SelectOptions](#selectoptions) | 否 | - | select内容以及事件。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 58| operationType | [OperationType](#operationtype) | 否 | \@Prop | 操作区(右侧)元素样式。<br/>默认值:OperationType.BUTTON<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 59| operationItem | Array<[OperationOption](#operationoption)> | 否 | - | 操作区(右侧)的设置项。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 60| operationSymbolOptions<sup>12+</sup> | Array<[SymbolOptions](#symboloptions12)> | 否 | - | operationType为OperationType.ICON_GROUP,<br/>operationItem设置多个图标,图标为[SymbolGlyph](ts-basic-components-symbolGlyph.md)时的设置项。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 61| primaryTitleModifier<sup>12+</sup> | [TextModifier](ts-universal-attributes-attribute-modifier.md#自定义modifier) | 否 | - | 设置标题文本属性,如设置标题颜色、字体大小、字重等。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 62| secondaryTitleModifier<sup>12+</sup> | [TextModifier](ts-universal-attributes-attribute-modifier.md#自定义modifier) | 否 | - | 设置副标题文本属性,如设置标题颜色、字体大小、字重等。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 63| titleBuilder<sup>12+</sup> | () => void | 否 | @BuilderParam | 自定义标题区内容<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 64| contentMargin<sup>12+</sup> | [LocalizedMargin](ts-types.md#localizedmargin12) | 否 | @Prop | 子标题外边距,不支持设置负数。<br />默认值:<br /> `{start: LengthMetrics.resource(` <br /> `$r('sys.float.margin_left'))`, <br /> `end: LengthMetrics.resource(` <br /> `$r('sys.float.margin_right'))}`<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 65| contentPadding<sup>12+</sup> | [LocalizedPadding](ts-types.md#localizedpadding12) | 否 | @Prop | 子标题内边距。<br />默认值:<br />左侧为副标题或副标题加图标时:<br /> {start: LengthMetrics.vp(12), end: LengthMetrics.vp(12)}。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。| 66 67 68## OperationType 69 70**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 71 72**系统能力:** SystemCapability.ArkUI.ArkUI.Full 73 74**设备行为差异:** 该接口在Wearable设备上使用时,应用程序运行异常, 异常信息中提示接口未定义,在其他设备中可正常调用。 75 76| 名称 | 值 | 说明 | 77| -------- | -------- | -------- | 78| TEXT_ARROW | 0 | 文本按钮(带右箭头)。 | 79| BUTTON | 1 | 文本按钮(不带右箭头)。 | 80| ICON_GROUP | 2 | 图标按钮(最多支持配置三张图标)。 | 81| LOADING | 3 | 加载动画。 | 82 83## SelectOptions 84 85**系统能力:** SystemCapability.ArkUI.ArkUI.Full 86 87**设备行为差异:** 该接口在Wearable设备上使用时,应用程序运行异常, 异常信息中提示接口未定义,在其他设备中可正常调用。 88 89| 名称 | 类型 | 必填 | 说明 | 90| -------- | -------- | -------- |--------------------------------------------------------------------------------------------------------------------------------------------------------------| 91| options | Array<[SelectOption](ts-basic-components-select.md#selectoption对象说明)> | 是 | 下拉选项内容。 <br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 92| selected | number | 否 | 设置下拉菜单初始选项的索引。<br/>取值范围:大于等于-1。<br/>第一项的索引为0。<br/>当不设置selected属性时,默认选择值为-1,菜单项不选中。<br/>若设置数值小于-1,按不选中处理。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 93| value | [ResourceStr](ts-types.md#resourcestr) | 否 | 设置下拉按钮本身的文本内容。<br/>默认值:空字符串。<br/>**说明**:如果文本大于列宽时,文本被截断。从API version 20开始,支持Resource类型。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 94| onSelect | (index: number, value?: string) => void | 否 | 下拉菜单选中某一项的回调。<br/>- index:选中项的索引。<br/>- value:选中项的值。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 95| defaultFocus<sup>18+</sup> | boolean | 否 | 下拉按钮是否为默认焦点。<br/>true:下拉按钮是默认焦点。<br/>false:下拉按钮不是默认焦点。<br />默认值:false <br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 96 97## OperationOption 98 99**系统能力:** SystemCapability.ArkUI.ArkUI.Full 100 101**设备行为差异:** 该接口在Wearable设备上使用时,应用程序运行异常, 异常信息中提示接口未定义,在其他设备中可正常调用。 102 103| 名称 | 类型 | 必填 | 说明 | 104| -------- | -------- | -------- |----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| 105| value | [ResourceStr](ts-types.md#resourcestr) | 是 | 文本内容。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 106| action | ()=>void | 否 | 子标题右侧按钮点击事件。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 107| accessibilityLevel<sup>18+<sup> | string | 否 | 子标题右侧按钮无障碍重要性。用于控制当前项是否可被无障碍辅助服务所识别。<br/>支持的值为:<br/>"auto":当前组件会转换"yes"。<br/>"yes":当前组件可被无障碍辅助服务所识别。<br/>"no":当前组件不可被无障碍辅助服务所识别。<br/>"no-hide-descendants":当前组件及其所有子组件不可被无障碍辅助服务所识别。<br/>默认值:"auto"<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 108| accessibilityText<sup>18+<sup> | [ResourceStr](ts-types.md#resourcestr) | 否 | 子标题右侧按钮的无障碍文本属性。当组件不包含文本属性时,屏幕朗读选中此组件时不播报,使用者无法清楚地知道当前选中了什么组件。为了解决此场景,开发人员可为不包含文字信息的组件设置无障碍文本,当屏幕朗读选中此组件时播报无障碍文本的内容,帮助屏幕朗读的使用者清楚地知道自己选中了什么组件。<br/>默认值:类型为TEXT_ARROW和BUTTON时默认值为当前项value属性内容,其他类型默认值为“ ”。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 109| accessibilityDescription<sup>18+<sup> | [ResourceStr](ts-types.md#resourcestr) | 否 | 子标题右侧按钮的无障碍描述。此描述用于向用户详细解释当前组件,开发人员应为组件的这一属性提供较为详尽的文本说明,以协助用户理解即将执行的操作及其可能产生的后果。特别是当这些后果无法仅从组件的属性和无障碍文本中直接获知时。如果组件同时具备文本属性和无障碍说明属性,当组件被选中时,系统将首先播报组件的文本属性,随后播报无障碍说明属性的内容。<br/>默认值:类型为LOADING时,默认值为“正在加载”,其他类型默认值为“单指双击即可执行”。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 110| defaultFocus<sup>18+</sup> | boolean | 否 | 子标题右侧按钮是否为默认焦点。<br/>true:子标题右侧按钮是默认焦点。<br/>false:子标题右侧按钮不是默认焦点。<br />默认值:false <br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 111## SymbolOptions<sup>12+</sup> 112 113**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 114 115**系统能力:** SystemCapability.ArkUI.ArkUI.Full 116 117**设备行为差异:** 该接口在Wearable设备上使用时,应用程序运行异常, 异常信息中提示接口未定义,在其他设备中可正常调用。 118 119| 名称 | 类型 | 必填 | 说明 | 120| -------- | -------- | -------- |-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| 121| fontColor | Array<[ResourceColor](ts-types.md#resourcecolor)> | 否 | 设置[SymbolGlyph](ts-basic-components-symbolGlyph.md)颜色。<br/>默认值:不同渲染策略下默认值不同。 | 122| fontSize | number \| string \| [Resource](ts-types.md#resource) | 否 | 设置[SymbolGlyph](ts-basic-components-symbolGlyph.md)大小。<br/>number类型取值范围:大于等于0。<br/>设置string类型时,支持number类型取值的字符串形式,可以附带单位,例如:"10","10fp"。<br/>默认值:系统默认值。 | 123| fontWeight | number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string | 否 | 设置[SymbolGlyph](ts-basic-components-symbolGlyph.md)粗细。<br/>number类型取值[100,900],取值间隔为100,默认为400,取值越大,字体越粗。<br/>string类型仅支持number类型取值的字符串形式,例如“400”,以及“bold”、“bolder”、“lighter”、“regular” 、“medium”分别对应FontWeight中相应的枚举值。<br/>默认值:FontWeight.Normal | 124| renderingStrategy | [SymbolRenderingStrategy](ts-basic-components-symbolGlyph.md#symbolrenderingstrategy11枚举说明) | 否 | 设置[SymbolGlyph](ts-basic-components-symbolGlyph.md)渲染策略。<br/>默认值:SymbolRenderingStrategy.SINGLE<br/>**说明:**<br/>$r('sys.symbol.ohos_*')中引用的资源仅ohos_trash_circle、ohos_folder_badge_plus、ohos_lungs支持分层与多色模式。 | 125| effectStrategy | [SymbolEffectStrategy](ts-basic-components-symbolGlyph.md#symboleffectstrategy11枚举说明) | 否 | 设置[SymbolGlyph](ts-basic-components-symbolGlyph.md)动效策略。<br/>默认值:SymbolEffectStrategy.NONE<br/>**说明:**<br/>$r('sys.symbol.ohos_*')中引用的资源仅ohos_wifi支持层级动效模式。 | 126 127## 事件 128不支持[通用事件](ts-component-general-events.md)。 129 130## 示例 131### 示例1(效率型子标题) 132该示例主要演示子标题左侧为icon、secondaryTitle,右侧operationType为按钮类型。 133 134```ts 135import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 136 137@Entry 138@Component 139struct SubHeaderExample { 140 build() { 141 Column() { 142 SubHeader({ 143 icon: $r('sys.media.ohos_ic_public_email'), 144 secondaryTitle: '二级标题', 145 operationType: OperationType.BUTTON, 146 operationItem: [{ 147 value: '操作', 148 action: () => { 149 Prompt.showToast({ message: 'demo' }); 150 } 151 }] 152 }) 153 } 154 } 155} 156``` 157 158 159 160### 示例2(双行文本内容型子标题) 161该示例主要演示子标题左侧为primaryTitle、secondaryTitle,右侧operationType类型为TEXT_ARROW。 162 163```ts 164import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 165 166@Entry 167@Component 168struct SubHeaderExample { 169 build() { 170 Column() { 171 SubHeader({ 172 primaryTitle: '一级标题', 173 secondaryTitle: '二级标题', 174 operationType: OperationType.TEXT_ARROW, 175 operationItem: [{ 176 value: '更多', 177 action: () => { 178 Prompt.showToast({ message: 'demo' }); 179 } 180 }] 181 }) 182 } 183 } 184} 185``` 186 187 188 189### 示例3(spinner型内容型子标题) 190该示例主要演示子标题左侧为select,右侧operationType类型为ICON_GROUP。 191 192```ts 193import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 194 195@Entry 196@Component 197struct SubHeaderExample { 198 build() { 199 Column() { 200 SubHeader({ 201 // 左侧为select选择器 202 select: { 203 options: [{ value: 'aaa' }, { value: 'bbb' }, { value: 'ccc' }], 204 value: 'selectDemo', 205 selected: 2, 206 onSelect: () => { 207 Prompt.showToast({ message: 'demo' }); 208 } 209 }, 210 operationType: OperationType.ICON_GROUP, 211 // 右侧为三个icon图标 212 operationItem: [{ 213 value: $r('sys.media.ohos_ic_public_email'), 214 action: () => { 215 Prompt.showToast({ message: 'demo' }) 216 } 217 }, { 218 value: $r('sys.media.ohos_ic_public_email'), 219 action: () => { 220 Prompt.showToast({ message: 'demo' }); 221 } 222 }, { 223 value: $r('sys.media.ohos_ic_public_email'), 224 action: () => { 225 Prompt.showToast({ message: 'demo' }); 226 } 227 }] 228 }) 229 } 230 } 231} 232``` 233 234 235 236### 示例4(设置左侧symbol图标) 237该示例主要演示子标题左侧icon设置symbol图标。 238 239```ts 240 241import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 242 243@Entry 244@Component 245struct SubHeaderExample { 246 build() { 247 Column() { 248 SubHeader({ 249 // 设置icon为symbol图标 250 icon: $r('sys.symbol.ohos_wifi'), 251 iconSymbolOptions: { 252 effectStrategy: SymbolEffectStrategy.HIERARCHICAL, 253 }, 254 secondaryTitle: '标题', 255 operationType: OperationType.BUTTON, 256 operationItem: [{ 257 value: '操作', 258 action: () => { 259 Prompt.showToast({ message: 'demo' }); 260 } 261 }] 262 }) 263 } 264 } 265} 266``` 267 268 269 270### 示例5(设置右侧symbol图标) 271该示例主要演示子标题operationType设置为OperationType.ICON_GROUP,operationItem的value设置为symbol图标。 272 273```ts 274import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 275 276@Entry 277@Component 278struct SubHeaderExample { 279 build() { 280 Column() { 281 SubHeader({ 282 // 设置左侧select 283 select: { 284 options: [{ value: 'aaa' }, { value: 'bbb' }, { value: 'ccc' }], 285 value: 'selectDemo', 286 selected: 2, 287 onSelect: () => { 288 Prompt.showToast({ message: 'demo' }); 289 } 290 }, 291 operationType: OperationType.ICON_GROUP, 292 // 设置右侧icon 293 operationItem: [{ 294 value: $r('sys.symbol.ohos_lungs'), 295 action: () => { 296 Prompt.showToast({ message: 'icon1' }); 297 } 298 }, { 299 value: $r('sys.symbol.ohos_lungs'), 300 action: () => { 301 Prompt.showToast({ message: 'icon2' }); 302 } 303 }, { 304 value: $r('sys.symbol.ohos_lungs'), 305 action: () => { 306 Prompt.showToast({ message: 'icon3' }); 307 } 308 }], 309 // 设置右侧icon图标symbol样式 310 operationSymbolOptions: [{ 311 fontWeight: FontWeight.Lighter, 312 }, { 313 renderingStrategy: SymbolRenderingStrategy.MULTIPLE_COLOR, 314 fontColor: [Color.Blue, Color.Grey, Color.Green], 315 }, { 316 renderingStrategy: SymbolRenderingStrategy.MULTIPLE_OPACITY, 317 fontColor: [Color.Blue, Color.Grey, Color.Green], 318 }] 319 }) 320 } 321 } 322} 323``` 324 325 326 327### 示例6(自定义标题内容) 328 该示例主要演示SubHeader设置titleBuilder自定义标题内容的效果。 329 330```ts 331import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 332 333@Entry 334@Component 335struct SubHeaderExample { 336 // 自定义左侧标题 337 @Builder 338 TitleBuilder(): void { 339 Text('自定义标题') 340 .fontSize(24) 341 .fontColor(Color.Blue) 342 .fontWeight(FontWeight.Bold) 343 } 344 345 build() { 346 Column() { 347 SubHeader({ 348 // 调用TitleBuilder 349 titleBuilder: () => { 350 this.TitleBuilder(); 351 }, 352 primaryTitle: '一级标题', 353 secondaryTitle: '二级标题', 354 icon: $r('sys.symbol.ohos_star'), 355 operationType: OperationType.TEXT_ARROW, 356 operationItem: [{ 357 value: '更多信息', 358 action: () => { 359 Prompt.showToast({ message: 'demo' }); 360 } 361 }] 362 }) 363 } 364 } 365} 366``` 367 368 369### 示例7(自定义标题样式) 370该示例主要演示SubHeader设置标题和副标题字体样式以及标题内外边距的效果。 371 372```ts 373import { Prompt, OperationType, SubHeader, LengthMetrics, TextModifier } from '@kit.ArkUI'; 374 375@Entry 376@Component 377struct SubHeaderExample { 378 // 设置主副标题文本颜色 379 @State primaryModifier: TextModifier = new TextModifier().fontColor(Color.Blue); 380 @State secondaryModifier: TextModifier = new TextModifier().fontColor(Color.Blue); 381 382 build() { 383 Column() { 384 SubHeader({ 385 primaryTitle: 'primaryTitle', 386 secondaryTitle: 'secondaryTitle', 387 primaryTitleModifier: this.primaryModifier, 388 secondaryTitleModifier: this.secondaryModifier, 389 operationType: OperationType.TEXT_ARROW, 390 operationItem: [{ 391 value: '更多信息', 392 action: () => { 393 Prompt.showToast({ message: 'demo' }); 394 } 395 }], 396 // 标题内外间距 397 contentMargin: { start: LengthMetrics.vp(20), end: LengthMetrics.vp(20) }, 398 contentPadding: { start: LengthMetrics.vp(20), end: LengthMetrics.vp(20) } 399 }) 400 } 401 } 402} 403``` 404 405 406 407 408### 示例8(右侧按钮自定义播报) 409从API version 18开始,该示例通过设置SubHeader的右侧按钮属性accessibilityText、accessibilityDescription、accessibilityLevel自定义屏幕朗读播报文本。 410```ts 411import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 412 413@Entry 414@Component 415struct SubHeaderExample { 416 build() { 417 Column() { 418 Divider().color('grey').width('100%').height('2vp') 419 SubHeader({ 420 // 图标+二级标题, 右侧button 421 icon: $r('sys.media.ohos_ic_public_email'), 422 secondaryTitle: '二级标题', 423 operationType: OperationType.BUTTON, 424 operationItem: [{ 425 value: '操作', 426 action: () => { 427 Prompt.showToast({ message: 'demo' }) 428 } 429 }] 430 }) 431 Divider().color('grey').width('100%').height('2vp') 432 SubHeader({ 433 // 右侧text_arrow 434 primaryTitle: '一级标题', 435 secondaryTitle: '二级标题', 436 operationType: OperationType.TEXT_ARROW, 437 operationItem: [{ 438 value: '更多', 439 action: () => { 440 Prompt.showToast({ message: 'demo' }) 441 } 442 }] 443 }) 444 Divider().color('grey').width('100%').height('2vp') 445 SubHeader({ 446 //左侧select 右侧是icon_(依次获焦) 447 select: { 448 options: [{ value: 'aaa' }, { value: 'bbb' }, { value: 'ccc' }], 449 value: 'selectDemo', 450 selected: 0, 451 onSelect: (index: number, value?: string) => { 452 console.log(`SubHeader onSelect index : ${index}, value: ${value}`); 453 } 454 }, 455 operationType: OperationType.ICON_GROUP, 456 operationItem: [{ 457 value: $r('sys.media.ohos_ic_public_email'), 458 accessibilityText: '图标1', 459 accessibilityLevel: 'yes', 460 }, { 461 value: $r('sys.media.ohos_ic_public_email'), 462 accessibilityText: '图标2', 463 accessibilityLevel: 'no', 464 }, { 465 value: $r('sys.media.ohos_ic_public_email'), 466 accessibilityText: '图标3', 467 accessibilityDescription: '点击操作图标3', 468 }] 469 }) 470 Divider().color('grey').width('100%').height('2vp') 471 } 472 } 473} 474``` 475 476 477### 示例9(右侧按钮设置默认获焦) 478从API version 18开始,该示例通过设置SubHeader的右侧按钮属性defaultFocus使其默认获焦。 479```ts 480import { Prompt, OperationType, SubHeader } from '@kit.ArkUI'; 481 482@Entry 483@Component 484struct SubHeaderExample { 485 build() { 486 Column() { 487 SubHeader({ 488 // 图标+二级标题, 右侧button 489 icon: $r('sys.media.ohos_ic_public_email'), 490 secondaryTitle: '二级标题', 491 operationType: OperationType.BUTTON, 492 operationItem: [{ 493 value: '操作', 494 defaultFocus: true, 495 action: () => { 496 Prompt.showToast({ message: 'demo' }) 497 } 498 }] 499 }) 500 } 501 } 502} 503``` 504 505