创建弹窗组件

弹窗组件 ： 

//  不需要 @component  

//  预览用 @Preview

@CustomDialog 

// 默认导出

export defalut struct Dialog {

//  定义后

controller: CustomDialogController 

//  this.controller.open()  开启弹窗

//  this.controller.colse()  关闭弹窗

 

//  取消 和 确定

cancel: () => void 

confirm: () => void 

     build () {

        Column(){ 

           Button('取消')   //   用 $r 获取  string配置 en zh

           .onClick(()=>{

             this.cotroller.close() 

            this.cancel()

              })

           Button('确定')   //   用 $r 获取  string配置 en zh

           .onClick(()=>{

             this.cotroller.close() 

            this.confirm()

              })

               }

    }

}

  使用父组件  ：   

@Entry 

@Component 

struct Dialog {

    dialogController: CustDialogController  = new CustDialogController ({ 

      builder : Dialog ({      //  Dialog  记得 import 导入

              cancel： this.onCancel,

              confirm:  this.onConfirm

       }),   alignment: DialogAlignment,.Default,  //  设置dialog对其方式 枚举 默认底部

} )

        onCancel(){ 

               console.log('cancel')

                }

        onConfirm(){ 

               console.log('confirm')

                }

 

      build() { 

             Button('打开弹窗').onClick((）=>  { 

                 this.dialogController.open()  // 打开弹窗

                }）

        } 

 

}