HarmonyOS 鸿蒙Next button从低层级变到高层级 无法点击

HarmonyOS 鸿蒙Next button从低层级变到高层级 无法点击

interface ImageCount { url: ResourceStr count: number }

@Entry @Component struct PrizeDraw { @State images: ImageCount[] = [ { url: $r(‘app.media.bg_00’), count: 0 }, { url: $r(‘app.media.bg_01’), count: 0 }, { url: $r(‘app.media.bg_02’), count: 0 }, { url: $r(‘app.media.bg_03’), count: 0 }, { url: $r(‘app.media.bg_04’), count: 0 }, { url: $r(‘app.media.bg_05’), count: 0 }, ]

//透明度 @State maskOpacity: number = 0 //层级 @State maskIndex: number = -1

build() {

Stack() {

  //生肖卡
  Column() {
    Grid() {
      ForEach(this.images, (item: ImageCount, index: number) => {
        GridItem() {
          Badge({
            count: item.count,
            position: BadgePosition.RightTop,
            style: {
              fontSize: 12,
              badgeSize: 16,
              badgeColor: '#FA2A2D'
            }
          }) {
            Image(item.url)
              .width(80)
          }
        }
      })

    }
    .columnsTemplate('1fr 1fr 1fr')
    .rowsTemplate('1fr 1fr')
    .width('100%')
    .height(300)
    .margin({ top: 100 })

    Button('立即抽卡')
      .width(200)
      .backgroundColor('#ef5b8c')
      .margin({ top: 50 })
      .onClick(()=>{
        //点击时  修改遮罩参数 让遮罩显示
        this.maskOpacity=1
        //点击时  修改遮罩层级 让遮罩显示
        this.maskIndex=99

console.log(‘2222’) })

  }
  .height('100%')
  .width('100%')


  //抽卡层
  Column({space:30}) {
    Text('获得生肖卡')
      .fontColor('#f5ebcf')
      .fontSize(25)
      .fontWeight(700)
    Image($r('app.media.img_00'))
      .width(200)
    Button('开心收下')
      .width(200)
      .height(50)
      .backgroundColor(Color.Transparent)
      .border({width:1,color:'#fff9e0'})
      .onClick(()=>{
        //点击时  修改遮罩参数 让遮罩不显示
        this.maskOpacity=0
        //点击时  修改遮罩层级 让遮罩不显示
        this.maskIndex=-1

        console.log('111')
      })


  }.width('100%')
  .height('100%')
  .backgroundColor('#cc000000')
  .justifyContent(FlexAlign.Center)
  //设置透明度
  .opacity(this.maskOpacity)
  //层级
  .zIndex(this.maskIndex)

}

} }