在HarmonyOS NEXT开发中@ohos.ArkUI.advanced.SegmentButton (分段按钮) 如何触发点击事件?

在HarmonyOS NEXT开发中@ohos.ArkUI.advanced.SegmentButton (分段按钮) 如何触发点击事件?

阅读 934
1 个回答

可以在@watch监听方法中编写点击事件的逻辑:

import { 
  ItemRestriction, 
  SegmentButton, 
  SegmentButtonOptions, 
  SegmentButtonTextItem 
} from '@ohos.ArkUI.advanced.SegmentButton' 
 
@Entry 
@Component 
struct Index { 
  @State tabOptions: SegmentButtonOptions = SegmentButtonOptions.tab({ 
    buttons: [{ text: '页签按钮1' }, { text: '页签按钮2' }, 
      { text: '页签按钮3' }] as ItemRestriction<SegmentButtonTextItem>, 
    backgroundBlurStyle: BlurStyle.BACKGROUND_THICK 
  }) 
  @State tf: boolean = true 
  @State @Watch('onSegmentButtonChange') tabSelectedIndexes: number[] = [0] 
 
  onSegmentButtonChange() { 
    this.tf = !this.tf 
    console.log(`选中按钮索引 -- ${this.tabSelectedIndexes}`); 
  } 
 
  aboutToAppear(): void { 
    console.log("122233") 
  } 
 
  build() { 
    Row() { 
      Column() { 
        Column({ space: 25 }) { 
          SegmentButton({ options: this.tabOptions, selectedIndexes: $tabSelectedIndexes }) 
          TextInput({ text: `${this.tabSelectedIndexes}` }).enabled(this.tf) 
        }.width('90%') 
      }.width('100%') 
    }.height('100%') 
  } 
}