鸿蒙系统中Builder函数传参UI不更新问题如何解决？

Question

鸿蒙中把builder函数传参与UI渲染问题

初来乍到，请教各位UU们一个问题：在使用@Builder函数封装一个用于tabBar传值的函数，并且单独放在相同目录的另一个页面中，使用export导出。其中形参有多个，函数里面用条件控制的属性不生效了，但是把builder函数和tabBar的Tabs组件放在同一个页面里能够实现效果，请问大家这个问题的原因和解决思路。
附代码和截图：

let  selectedIndex: number = 0
@Builder
export function  TabBarComp (isShowIcon: boolean = false, isShowDivider: boolean = false, index: number, name: string) {
    Column() {
      if (isShowIcon) {
        Image($r("app.media.startIcon"))
          .size({ width: 18, height: 18 })
          .margin({ bottom: 5 })
      }

      if (isShowIcon) {
        Text(name)
          .fontSize(15)
          .fontColor(selectedIndex === index ? "#ff0066ff" : "#000")
          .lineHeight(12)
          .margin({ top: 5, bottom: 3 })
      } else {
        Text(name)
          .fontSize(15)
          .fontColor(selectedIndex === index ? "#ffffc800" : "#000")
          .lineHeight(12)
          .margin({ top: 5, bottom: 3 })
      }
      if (isShowDivider) {
        Divider()
          .strokeWidth(2)
          .color("#ffffc800")
          .opacity(selectedIndex === index ? 1 : 0)
      }

    }
}

尝试了把builer函数换为自定义组件，效果可行，但是不能传入tabBar()中使用，在想是不是builder函数只能放在一个页面中使用？

Answer 1

参数传递规则
自定义构建函数的参数传递有按值传递和按引用传递两种，均需遵守以下规则：

参数的类型必须与参数声明的类型一致，不允许undefined、null和返回undefined、null的表达式。

在@Builder修饰的函数内部，不允许改变参数值。

@Builder内UI语法遵循UI语法规则。

只有传入一个参数，且参数需要直接传入对象字面量才会按引用传递该参数，其余传递方式均为按值传递。

按值传递参数
调用@Builder装饰的函数默认按值传递。当传递的参数为状态变量时，状态变量的改变不会引起@Builder方法内的UI刷新。所以当使用状态变量的时候，推荐使用按引用传递。

参考文档：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides...