输入关键字搜索
开发者能力认证
鸿蒙高校创新赛
HarmonyOS 7
animation
HarmonyOS行业解决方案
layoutWeight
HarmonyOS模板&组件
bindPopup
bindsheet
CTRL+K
文档管理中心

HarmonyOS

输入关键字搜索
开发者能力认证
鸿蒙高校创新赛
HarmonyOS 7
animation
HarmonyOS行业解决方案
layoutWeight
HarmonyOS模板&组件
bindPopup
bindsheet
CTRL+K
FAQ
FAQ应用框架开发UI框架组件使用使用promptAction.openCustomDialog创建自定义弹窗闪退

使用promptAction.openCustomDialog创建自定义弹窗闪退

更新时间: 2026-06-26 07:47
本文导读

问题现象

使用promptAction.openCustomDialog创建自定义弹窗，将全局Builder构建函数作为自定义弹窗内容构造器。弹窗弹出时应用闪退。错误日志为：

收起
自动换行
深色代码主题
复制
  1. Reason:TypeError Error name:TypeError Error message:Cannot read property observeComponentCreation2 of undefined

问题代码为：

收起
自动换行
深色代码主题
复制
  1. import { promptAction } from '@kit.ArkUI'
  2. 

  3. 

  4. @Builder
  5. function customDialogComponent() {
  6.   Column() {
  7.     Text('customDialogComponent')
  8.   }
  9. }
  10. 

  11. 

  12. @Entry
  13. @Component
  14. struct Index {
  15.   build() {
  16.     Column() {
  17.       Button('弹窗').onClick(() => {
  18.         this.getUIContext().getPromptAction().openCustomDialog({
  19.           builder: () => {
  20.             customDialogComponent()
  21.           },
  22.           alignment: DialogAlignment.Center
  23.         })
  24.       })
  25.     }
  26.   }
  27. }

背景知识

ArkUI提供了一种轻量的UI元素复用机制@Builder，其内部UI结构固定，仅与使用方进行数据传递，开发者可以将重复使用的UI元素抽象成一个方法，在build方法里调用。

解决方案

自定义构建函数@Builder可以在所属组件的build方法和其他自定义构建函数中调用，但不允许在组件外调用。因此，需要将自定义构建函数@Builder移至结构体内部，示例代码如下：

收起
自动换行
深色代码主题
复制
  1. @Entry
  2. @Component
  3. struct Index55 {
  4.   private customDialogComponentId: number = 0;
  5. 

  6. 

  7.   // 在结构体内构建定义函数
  8.   @Builder
  9.   customDialogComponent() {
  10.     Column() {
  11.       Text('温馨提示')
  12.         .fontSize(25)
  13.         .margin({ top: 10 });
  14.       Text('请注意,一旦删除,该数据将从缓存中删除且不可恢复。请谨慎选择。')
  15.         .padding({ left: 20, right: 20 });
  16.       Row({ space: 50 }) {
  17.         Button('确认').onClick(() => {
  18.           try {
  19.             this.getUIContext().getPromptAction().closeCustomDialog(this.customDialogComponentId);
  20.           } catch (error) {
  21.             let message = (error as BusinessError).message;
  22.             let code = (error as BusinessError).code;
  23.             console.error(`closeCustomDialog error code is ${code}, message is ${message}`);
  24.           }
  25.         });
  26.         Button('取消').onClick(() => {
  27.           try {
  28.             this.getUIContext().getPromptAction().closeCustomDialog(this.customDialogComponentId);
  29.           } catch (error) {
  30.             let message = (error as BusinessError).message;
  31.             let code = (error as BusinessError).code;
  32.             console.error(`closeCustomDialog error code is ${code}, message is ${message}`);
  33.           }
  34.         });
  35.       };
  36.     }.height(200).padding(5).justifyContent(FlexAlign.SpaceAround);
  37.   }
  38. 

  39. 

  40.   build() {
  41.     RelativeContainer() {
  42.       Button('弹窗')
  43.         .alignRules({
  44.           center: { anchor: '__container__', align: VerticalAlign.Center },
  45.           middle: { anchor: '__container__', align: HorizontalAlign.Center }
  46.         })
  47.         .onClick(() => {
  48.           this.getUIContext().getPromptAction().openCustomDialog({
  49.             builder: () => {
  50.               this.customDialogComponent();
  51.             },
  52.             alignment: DialogAlignment.Center
  53.           }).then((dialogId: number) => {
  54.             this.customDialogComponentId = dialogId;
  55.           });
  56.         });
  57.     }
  58.     .width('100%')
  59.     .height('100%');
  60.   }
  61. }

效果如下：

List组件通过拖拽改变排序
PersistenceV2持久化保存数据如何实现整体赋值
相关推荐
文档构建弹窗
文档ArkUI_NativeDialogAPI_1
文档基础自定义弹出框 (CustomDialog)
文档如何实现在class函数中直接调用自定义弹窗API
文档自定义弹窗 (CustomDialog)
文档弹窗组件封装
文档如何进行自定义弹窗的封装调用
文档不依赖UI组件的全局自定义弹出框 (openCustomDialog)
文档ArkUI_CustomDialogOptions
文档使用openCustomDialog实现菜单弹窗并返回选中项回调
简体中文
华为开发者联盟 版权所有 ©2026
问题反馈
使用条款
华为开发者联盟用户协议
关于华为开发者联盟与隐私的声明
Cookies
开源软件声明
在 FAQ 中进行搜索
请输入您想要搜索的关键词