HarmonyOS CustomDialog 的bug？

Question

如图所示，我在启动的时候做了一个隐私协议的弹窗，点击弹窗里面隐私协议或者用户协议，新的窗口会在对话框的下面打开，请问这个是什么问题，怎么解决？

Answer 1

变更后，若页面存在弹窗时进行路由跳转，只会进行页面内容切换，不再自动关闭弹窗，即弹窗始终处于页面之上不会消失您可以参考下：

https://gitee.com/openharmony/docs/blob/master/zh-cn/release-notes/changelogs/OpenHarmony\_5.0.0.17/changelogs-arkui.md\#clarkui2–dialog%E5%9C%A8%E9%A1%B5%E9%9D%A2%E8%B7%AF%E7%94%B1%E8%B7%B3%E8%BD%AC%E6%97%B6%E5%85%B3%E9%97%AD%E8%A1%8C%E4%B8%BA%E5%8F%98%E6%9B%B4

为您提供一种解决方案您看能否接受参考以下demo:

Page248201.

import { router } from '@kit.ArkUI';

// 弹窗交互
@CustomDialog
@Component
struct CustomDialogExample {
  controller: CustomDialogController = new CustomDialogController({
    builder: CustomDialogExample({showFlag: this.showFlag}),
    autoCancel: false,
  })
  @State text: string = '自定义动画的弹窗'
  @Link showFlag: Visibility;
  @State isAutoCancel: boolean = false;
  textController: TextAreaController = new TextAreaController()

  build() {
    Column() {
      Row() {
        Button('取消')
          .onClick(() => {
            this.cancel();
          })

        Button('跳转')
          .onClick(() => {
            router.pushUrl({
              url: 'pages/Page248202',
            })
          })
        Text(this.text)
      }
      .padding(8)
      .backgroundColor('#FFFFFF')
      .height(200)
      .margin({ bottom: 30 })
      .width('80%')
      .borderRadius(10)
      .backgroundColor( 'rgba(255, 255, 255, 1)')
    }
    .justifyContent(FlexAlign.End)
    .width('100%')
    .height("100%")
    .onClick(() => {
      if (this.isAutoCancel) {
        this.cancel();
      }
    })
    .visibility(this.showFlag)
    .backgroundColor( 'rgba(0, 0, 0, 0.1)')
  }

  cancel() {
    this.showFlag = Visibility.None
    console.log("-----closeDialog")
    this.controller.close()
  }
}

@Entry
@Component
struct Page248201 {
  @State message: string = "点击按钮改变信息"
  @State isAutoCancel: boolean = true;
  @State showFlag: Visibility = Visibility.Visible;
  dialogController: CustomDialogController = new CustomDialogController({
    builder: CustomDialogExample({ isAutoCancel: this.isAutoCancel, showFlag: this.showFlag}),
    autoCancel: this.isAutoCancel,
    customStyle: true,
    isModal: false
  })

  onPageShow(): void {
    this.showFlag = Visibility.Visible;
    console.log("-----onPageShow")
  }
  onPageHide(): void {
    this.showFlag = Visibility.None;
    console.log("-----onPageHide")
  }

  build() {
    Column() {
      Button('显示弹窗')
        .onClick(() => {
          this.showFlag = Visibility.Visible;
          this.dialogController.open()
        })
      Blank().height(200)
      Button(this.message)
        .onClick(() => {
          this.message = '信息已修改'
        })
    }.width('100%')
    .height('100%')
  }
}

Page248202.ets

import { router } from '@kit.ArkUI';

@Entry
@Component
struct Page248202 {
  @State message: string = "Second Page";

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize('38fp')
          .fontWeight(FontWeight.Bold)
        Blank()
        Button('Back')
          .fontSize('16fp')
          .width('296vp')
          .height('40vp')
          .backgroundColor(Color.Blue)
          .onClick(() => {
            router.back();
          })
      }
      .width('100%')
      .height('140vp')
    }
    .height('100%')
  }
}