参数传递规则
自定义构建函数的参数传递有按值传递和按引用传递两种,均需遵守以下规则:
- 参数的类型必须与参数声明的类型一致,不允许undefined、null和返回undefined、null的表达式。
- 在自定义构建函数内部,不允许改变参数值。如果需要改变参数值,且同步回调用点,建议使用@Link。
- @Builder内UI语法遵循UI语法规则
(1)按引用传递参数
按引用传递参数时,传递的参数可为状态变量,且状态变量的改变会引起@Builder方法内的UI刷新。ArkUI提供$$作为按引用传递参数的范式。
@Builder function test($$: { paramA1: string }) {Row() {Text(`UseStateVarByReference: ${$$.paramA1} `).margin(30)}
}
@Entry
@Component
struct Parent {@State label: string = 'Hello';build() {Column() {Divider()// 在Parent组件中调用test的时候,将this.label引用传递给testtest({ paramA1: this.label })Button('Click me').onClick(() => {// 点击“Click me”后,UI从“Hello”刷新为“ArkUI”this.label = 'ArkUI';})}}
}
(2)按值传递参数
调用@Builder装饰的函数默认按值传递。当传递的参数为状态变量时,状态变量的改变不会引起@Builder方法内的UI刷新。所以当使用状态变量的时候,推荐使用按引用传递。
@Builder function test(paramA1: string) {Row() {Text(`UseStateVarByReference: ${paramA1} `).margin(30)}
}
@Entry
@Component
struct Parent {@State label: string = 'Hello';build() {Column() {Divider()// 在Parent组件中调用test的时候,将this.label引用传递给testtest(this.label)Button('Click me').onClick(() => {// 点击“Click me”后,UI不会从“Hello”刷新为“ArkUI”this.label = 'ArkUI';})}}
}
就算一直点击按钮,也不会看到对应的组件发生变化,说明按照值传递不会引起@Builder方法内的UI刷新。