HarmonyOS 鸿蒙Next 自定义的CustomDialog中，跳转另一个Page 问题

可以参考以下实现：

import router from ‘@ohos.router’;

@Entry @Component struct Index { @State textValue: string = ‘Hello World’ @State visible: Visibility = Visibility.None

build() { // 使用stack可以实现假的dialog覆盖原页面上面 Stack() { Row() { // 初始页面 Column() { Text(‘Hello World’) .fontSize(50) .fontWeight(FontWeight.Bold) // 触发dialog的地方 Button(‘click’) .onClick(() => { console.log(“hit me!”) if (this.visible == Visibility.Visible) { this.visible = Visibility.None } else { this.visible = Visibility.Visible } }) .backgroundColor(0x777474) .fontColor(0x000000) } .width(‘100%’) } .height(‘100%’) .backgroundColor(0x885555) //这里开始是构造弹窗效果主要需要修改的地方，首先是加了一个半透明灰色的蒙层效果 Text(’’) .onClick(() => { if (this.visible == Visibility.Visible) { this.visible = Visibility.None } else { this.visible = Visibility.Visible } }) .width(‘100%’) .height(‘100%’) // 透明度可以自己调节一下 .opacity(0.16) .backgroundColor(0x000000) .visibility(this.visible)

  Column() {
    // 这个可以调节对话框效果，栅格布局，xs，sm，md，lg分别为四种规格
    // 下面的breakpoints是用来区别当前属于哪个类型的断点
    // gridRow里的栅格数量为总数，gridCol里的就是偏移和假Dialog所占据的栅格数
    GridRow({
      columns:{xs:1 ,sm: 4, md: 8, lg: 12},
      breakpoints: { value: ["400vp", "600vp", "800vp"],
        reference: BreakpointsReference.WindowSize },
    })
    {
      GridCol({
        span:{xs:1 ,sm: 2, md: 4, lg: 8},
        offset:{xs:0 ,sm: 1, md: 2, lg: 2}
      }){

        // 这里放的就是原Dialog里的column里的东西，稍微改改应该就可以用了
        Column() {
          Text('Change text').fontSize(20).margin({ top: 10, bottom: 10 })
          TextInput({ placeholder: '', text: this.textValue }).height(60).width('90%')
            .onChange((value: string) => {
              this.textValue = value
            })
          Text('Whether to change a text?').fontSize(16).margin({ bottom: 10 })
          Flex({ justifyContent: FlexAlign.SpaceAround }) {
            Button('cancel')
              .onClick(() => {
                if (this.visible == Visibility.Visible) {
                  this.visible = Visibility.None
                } else {
                  this.visible = Visibility.Visible
                }
              }).backgroundColor(0xffffff).fontColor(Color.Black)
            Button('jump')
              .onClick(() => {
                router.pushUrl({
                  url: 'pages/Second'
                })
              }).backgroundColor(0xffffff).fontColor(Color.Red)
          }.margin({ bottom: 10 })
        }
        .backgroundColor(0xffffff)
        .visibility(this.visible)
        .clip(true)
        .borderRadius(20)
      }
    }
  }.width('95%')//设置弹窗宽度
}

} }