HarmonyOS tab项中使用了Badge，count设置成0的时候，显示一条竖线？

Question

tab项中使用了Badge，count设置成0的时候，显示一条竖线，没有隐藏掉

demo样例：

@State currentIndex: number = 0
private tabsController: TabsController = new TabsController();
@State bottomMargin : number =  0;
@State messageCount:number = 0 ;

@Builder
tabBuilder(title:Resource,index:number,selectedImg: Resource, normalImg: Resource) {
  Column() {
    Badge({
      count:index == 2 ? this.messageCount : 0,
      style: {},
      position: BadgePosition.RightTop,
    }){
      Image(this.currentIndex === index ? selectedImg : normalImg)
        .width($r('app.float.mainPage_baseTab_size'))
        .height($r('app.float.mainPage_baseTab_size'))
        .objectFit(ImageFit.Contain)
    }.width($r('app.float.view_30'))

    Text(title)
      .margin({ top: $r('app.float.mainPage_baseTab_top') })
      .fontSize($r('app.float.tab_text_font_size'))
      .fontColor(this.currentIndex === index ? $r('app.color.tab_active_color') : $r('app.color.tab_normal_color'))
  }
  .justifyContent(FlexAlign.Center)
  .height($r('app.float.mainPage_barHeight'))
  .width('100%')
  .onClick(() => {
    this.currentIndex = index;
    this.tabsController.changeIndex(this.currentIndex);
  })
}

build() {
  Tabs({
    barPosition: BarPosition.End,
    controller: this.tabsController,
    index:this.currentIndex
  }) {
    TabContent() {
      HomePage() ;
    }
    .backgroundColor(Color.White)
    .tabBar(this.tabBuilder($r('app.string.menu_home'), 0, $r('app.media.menu_home_active'), $r('app.media.menu_home_normal')))
    TabContent() {
      ClassPage();
    }
    .backgroundColor(Color.White)
    .tabBar(this.tabBuilder($r('app.string.menu_class'), 1, $r('app.media.menu_class_active'), $r('app.media.menu_class_normal')))
    TabContent() {
      MinePage({messageCount:this.messageCount}) ;
    }
    .backgroundColor(Color.White)
    .tabBar(this.tabBuilder($r('app.string.menu_mine'), 2, $r('app.media.menu_mine_active'), $r('app.media.menu_mine_normal')))
    .layoutWeight(1)
  }
  .width('100%')
  .backgroundColor($r('app.color.tab_color'))
  .barHeight($r('app.float.mainPage_barHeight'))
  .scrollable(false)

Answer 1

可能是Badge的style中borderWidth的问题，count为0时，boder没有隐藏，内容隐藏了，手动设置borderWidth: 0看看可不可以