HarmonyOS Toggle组件怎么拦截？

在使用Toggle组件的时候，发现只有一个回调返回组件切换的结果，没法拦截。如果我们在Toggle处于on的状态下，点击切换时，弹出一个对话，在对话框处理完逻辑后，再决定Toggle是打开还是关闭，请问需要怎么处理？

HarmonyOS

zxjiu

2024-10-09 12:18:15

浏览

回答 1

待解决

回答 1

按赞同

按时间

put_get

可以使用onTouchIntercept拦截事件，参考demo：

@Entry  
@Component  
struct Page240522215803016 {  
  @State message: string = 'Hello World';  
  @State isToggleOn: boolean = false  
  dialogController: CustomDialogController = new CustomDialogController({  
    builder: CustomDialogExample({  
      confirm: () => {  
        this.onAccept()  
      },  
    }),  
  })  
  onAccept() {  
    if (this.isToggleOn) {  
      this.isToggleOn = false  
    } else {  
      this.isToggleOn = true  
    }  
  }  
  build() {  
    RelativeContainer() {  
      Toggle({ type: ToggleType.Switch, isOn: this.isToggleOn })// 调用onTouchIntercept修改该组件的HitTestMode属性  
        .onTouchIntercept((event: TouchEvent) => {  
          console.log("OnTouchIntercept + " + JSON.stringify(event));  
          this.dialogController.open()  
          return HitTestMode.None  
        })  
        .onChange((isOn: boolean) => {  
          console.info("isOn:" + isOn)  
          if (isOn) {  
            // 需要执行的操作  
          }  
        })  
    }  
    .height('100%')  
    .width('100%')  
  }  
}  
@CustomDialog  
export struct CustomDialogExample {  
  controller: CustomDialogController = new CustomDialogController({  
    builder: CustomDialogExample({}),  
  })  
  confirm?: () => void  
  build() {  
    Column() {  
      Text('点击确认')  
        .fontSize(20)  
        .margin({ top: 10, bottom: 10 })  
        .onClick(() => {  
          this.controller.close()  
          if (this.confirm) {  
            this.confirm()  
          }  
        })  
    }  
  }  
}