HarmonyOS 怎么配置tab默认选择的tabBar？

Question

如题：HarmonyOS 怎么配置tab默认选择的tabBar？

Answer 1

可以看一下：Tabs接口中的index参数。设置当前显示页签的索引。

参考链接：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-tabs-V5\#接口

可以参考一下下面的示例demo：

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-tabs-V5\#示例

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


let Storage = new LocalStorage();
@Entry(Storage)
@Component
struct intelligentTestBankPage {
  private TabsController: TabsController = new TabsController();

  @State isDataReady:boolean = false;

  @State currentIndex:number =  1;

  async aboutToAppear() {
  }


  async aboutToDisappear() {}

  @Builder tabBarBuilder(title:string,index:number){
    Column() {

      Button(title,{type:ButtonType.Capsule,stateEffect:true})
        .fontSize(20)
        .height(20)
        .backgroundColor(this.currentIndex === index? '#ff3fbffa':Color.Grey)
    }
    .width('100%')
    .onClick(()=>{
      this.currentIndex = index;
      this.TabsController.changeIndex(index);
    })
  }
  build() {
    Column() {
      Column() {
        Column(){
          Text('智能题库')
        }.height(20)
        .margin(5)
        
        Column(){
          // tabs 页签
          Tabs({
            barPosition: BarPosition.Start,
            index: this.currentIndex,
            controller: this.TabsController
          }) {
            TabContent() {
              // 题库
              Text('题库内容').fontSize(30)
            }
            .tabBar(this.tabBarBuilder('题库', 0))

            TabContent() {
              // 考点速记
              Text('考点速记内容').fontSize(30)
            }
            .tabBar(this.tabBarBuilder('考点速记', 1))
          }
          .scrollable(true)
          .barMode(BarMode.Fixed)
          .vertical(false)
          .barWidth('100%')
          .barHeight(30)
          .animationDuration(400)
          .width('100%')
          .margin(2)

        }.margin(5)
        
      }.height('100%')
      .justifyContent(FlexAlign.Start)
      .width('100%')
    }
    .height('100%')
    .justifyContent(FlexAlign.Start)

  }
}

interface  paramsClass{
  currentIndex:number;
  title:string;
}