HarmonyOS/OpenHarmony应用开发-ArkTS语言@BuilderParam引用@Builder函数

news/2025/3/4 18:31:55/

当开发者创建了自定义组件,并想对该组件添加特定功能时,例如在自定义组件中添加一个点击跳转操作。若直接在组件内嵌入事件方法,将会导致所有引入该自定义组件的地方均增加了该功能。为解决此问题,ArkUI引入了@BuilderParam装饰器,@BuilderParam用来装饰指向@Builder方法的变量,开发者可在初始化自定义组件时对此属性进行赋值,为自定义组件增加特定的功能。该装饰器用于声明任意UI描述的一个元素,类似slot占位符。

说明,从API version 9开始,该装饰器支持在ArkTS卡片中使用。

一、装饰器使用说明

1.初始化@BuilderParam装饰的方法

@BuildParam装饰的方法只能被自定义构建函数(@Builder装饰的方法)初始化。

使用所属自定义组件的自定义构建函数或者全局的自定义构建函数,在本地初始化

@BuilderParam。
@Builder function GlobalBuilder0() {}@Component
struct Child {@Builder doNothingBuilder() {};@BuilderParam aBuilder0: () => void = this.doNothingBuilder;@BuilderParam aBuilder1: () => void = GlobalBuilder0;build(){}
}用父组件自定义构建函数初始化子组件@BuildParam装饰的方法。
@Component
struct Child {@BuilderParam aBuilder0: () => void;build() {Column() {this.aBuilder0()}}
}@Entry
@Component
struct Parent {@Builder componentBuilder() {Text(`Parent builder `)}build() {Column() {Child({ aBuilder0: this.componentBuilder })}}
}

2.需注意this指向正确。

以下示例中,Parent组件在调用this.componentBuilder()时,this.label指向其所属组件,即“Parent”。@Builder componentBuilder()传给子组件@BuilderParam aBuilder0,在Child组件中调用this.aBuilder0()时,this.label指向在Child的label,即“Child”。
说明,开发者谨慎使用bind改变函数调用的上下文,可能会使this指向混乱。

@Component
struct Child {label: string = `Child`@BuilderParam aBuilder0: () => void;build() {Column() {this.aBuilder0()}}
}@Entry
@Component
struct Parent {label: string = `Parent`@Builder componentBuilder() {Text(`${this.label}`)}build() {Column() {this.componentBuilder()Child({ aBuilder0: this.componentBuilder })}}
}

二、使用场景
1.参数初始化组件

@BuilderParam装饰的方法可以是有参数和无参数的两种形式,需与指向的@Builder方法类型匹配。@BuilderParam装饰的方法类型需要和@Builder方法类型一致。

@Builder function GlobalBuilder1($$ : {label: string }) {Text($$.label).width(400).height(50).backgroundColor(Color.Blue)
}@Component
struct Child {label: string = 'Child'// 无参数类,指向的componentBuilder也是无参数类型@BuilderParam aBuilder0: () => void;// 有参数类型,指向的GlobalBuilder1也是有参数类型的方法@BuilderParam aBuilder1: ($$ : { label : string}) => void;build() {Column() {this.aBuilder0()this.aBuilder1({label: 'global Builder label' } )}}
}@Entry
@Component
struct Parent {label: string = 'Parent'@Builder componentBuilder() {Text(`${this.label}`)}build() {Column() {this.componentBuilder()Child({ aBuilder0: this.componentBuilder, aBuilder1: GlobalBuilder1 })}}
}

2.尾随闭包初始化组件示例

在自定义组件中使用@BuilderParam装饰的属性时也可通过尾随闭包进行初始化。在初始化自定义组件时,组件后紧跟一个大括号“{}”形成尾随闭包场景。

说明
此场景下自定义组件内有且仅有一个使用@BuilderParam装饰的属性。

开发者可以将尾随闭包内的内容看做@Builder装饰的函数传给@BuilderParam。示例如下:

// xxx.ets
@Component
struct CustomContainer {@Prop header: string;@BuilderParam closer: () => voidbuild() {Column() {Text(this.header).fontSize(30)this.closer()}}
}@Builder function specificParam(label1: string, label2: string) {Column() {Text(label1).fontSize(30)Text(label2).fontSize(30)}
}@Entry
@Component
struct CustomContainerUser {@State text: string = 'header';build() {Column() {// 创建CustomContainer,在创建CustomContainer时,通过其后紧跟一个大括号“{}”形成尾随闭包// 作为传递给子组件CustomContainer @BuilderParam closer: () => void的参数CustomContainer({ header: this.text }) {Column() {specificParam('testA', 'testB')}.backgroundColor(Color.Yellow).onClick(() => {this.text = 'changeHeader';})}}}
}

http://www.ppmy.cn/news/106226.html

相关文章

ChatGPT-AI地图

ChatGPT-AI地图 1、AI-对话 应用名称应用地址ChatGPThttps://chat.openai.com/NotionAINotion AIA.I. Data Sidekick:AI工具编写 SQL、文档等的速度提高10倍[AirOpsWritesonic:人工智能写作辅助工具Writesonic - Best AI Writer, Copywriting & Par…

案例挑战——MVVM框架理解和实践

MVVM框架理解和实践 一、背景介绍二、 什么是MVVM架构?1.架构示意图2.MVVM概念总结3.实现VM的框架 三、通过案例来理解MVVM框架1.没有使用MVVM架构的程序2.使用了MVVM架构的程序3.对比 四、总结 一、背景介绍 最近正在做新版项目的MVVM架构的结合业务的具体落地&am…

怎么让用户用好你的在线帮助文档协作工具?

在线帮助文档协作工具是现代企业中重要的工具,它可以帮助企业员工更好地协作,提高工作效率,减少沟通成本。然而,如何让用户用好在线帮助文档协作工具,满足其需求,本文将探讨以下几个方面: 一、…

MySQL高可用与扩展

✅作者简介:热爱Java后端开发的一名学习者,大家可以跟我一起讨论各种问题喔。 🍎个人主页:Hhzzy99 🍊个人信条:坚持就是胜利! 💞当前专栏:MySQL 🥭本文内容&a…

ELECTRA模型简单介绍

目录 一、整体概要 二、生成器 三、判别器 四、模型训练 五、其它改进 一、整体概要 ELECTRA(Efficiently Learning an Encoder that Classifies Token Replacements Accurately)采用了一种“生成器——判别器”结构,其与生成式对抗网络…

【1110. 删点成林】

来源:力扣(LeetCode) 描述: 给出二叉树的根节点 root,树上每个节点都有一个不同的值。 如果节点值在 to_delete 中出现,我们就把该节点从树上删去,最后得到一个森林(一些不相交的…

L1频段卫星导航射频前端低噪声放大器芯片 AT2659/AT2659S

AT2659 是一款具有高增益、低噪声系数的低噪声放大器(LNA)芯片,支持L1频段多模式全球卫星定位,可以应用于GPS、北斗二代、伽利略、Glonass等GNSS导航接收机中。芯片采用先进的SiGe工艺制造,采用1.5 mm X 1 mm 0.78 mm的…

【九】设计模式~~~结构型模式~~~外观模式(Java)

【学习难度:★☆☆☆☆,使用频率:★★★★★】 4.1. 模式动机 不知道大家有没有比较过自己泡茶和去茶馆喝茶的区别,如果是自己泡茶需要自行准备茶叶、茶具和开水,如图1(A)所示,而去茶馆喝茶,最…