当前位置：首页 > news >正文

鸿蒙UI开发——Builder与LocalBuilder对比

news 来源：原创 2025/7/7 0:13:31

1、概述

在ArkUI中，有的朋友应该接触过@Builder和@LocalBuilder。其中有了@LocalBuilder的存在，是为了解决组件的父子关系和状态管理的父子关系保持一致的问题。

这里面最直观的表现则是this的指向问题与组件刷新问题，本文对@Builder与@LocalBuilder的这两个问题做简单讨论。

2、引入问题

2.1. this指向问题

有下面一段代码：

class CounterInfo {  count: number = 0;}@Builderfunction defaultBuilder() {}@Entry@Componentstruct Parent {  label: string = 'parent';  @State CounterInfo: CounterInfo = { count: 0 };  @Builder  componentBuilder($$: CounterInfo) {    Text(`${'this指向: ' + this.label}`);    Text(`${'count参数: ' + $$.count}`).margin(10);  }  build() {    Column() {      Child({ contentBuilder: this.componentBuilder });    }  }}@Componentstruct Child {  label: string = 'child';  @BuilderParam contentBuilder: ((CounterInfo: CounterInfo) => void) = defaultBuilder;  @State CounterInfo: CounterInfo = { count: 2 };  build() {    Column() {      this.contentBuilder({ count: this.CounterInfo.count });      Text("本地count: " + this.CounterInfo.count)      Button("count递增 ").onClick(() => {        this.CounterInfo.count += 1;      }).margin(10)    }.width('100%')  }}

界面效果如下（此时停留一下，想想为什么）：

接下来，我们将上述代码中的13行，@Builder改为@LocalBuilder，代码将变成如下：

class CounterInfo {  count: number = 0;}@Builderfunction defaultBuilder() {}@Entry@Componentstruct Parent {  label: string = 'parent';  @State CounterInfo: CounterInfo = { count: 0 };  @LocalBuilder  componentBuilder($$: CounterInfo) {    Text(`${'this指向: ' + this.label}`);    Text(`${'count参数: ' + $$.count}`).margin(10);  }  build() {    Column() {      Child({ contentBuilder: this.componentBuilder });    }  }}@Componentstruct Child {  label: string = 'child';  @BuilderParam contentBuilder: ((CounterInfo: CounterInfo) => void) = defaultBuilder;  @State CounterInfo: CounterInfo = { count: 2 };  build() {    Column() {      this.contentBuilder({ count: this.CounterInfo.count });      Text("本地count: " + this.CounterInfo.count)      Button("count递增 ").onClick(() => {        this.CounterInfo.count += 1;      }).margin(10)    }.width('100%')  }}

显示效果将是如何呢？停下来稍微想想。

实际效果如下：

可以看到，我们将@Builder改为@LocalBuilder后，this.label取到的值发生了变化，从原来的child变为了parent，我们可以得到第一个结论：

@LocalBuilder修饰的方法，可以保证该方法的this永远指向最初创建的那个组件实例（在本例子中为parent）

另外，由于count参数和本地count都是2，由于这两个组件不在@LocalBuilder修饰的方法中，因此，this指向的是当前渲染的组件，即 child

2.2. 组件刷新问题

👉🏻 @Builder装饰器

继续上述例子，当我们13行的代码装饰器为@Builder时，点击【count递增】按钮的效果如下：

可以看到，count参数和本地count都发生了刷新。

👉🏻 @LocalBuilder装饰器

此时，我们如果将13行的装饰器改为@LocalBuilder时，点击【count递增】按钮的效果如下：

可以看到，只有本地count发生了刷新，而count参数并没有发生刷新。

❓ 为什么@LocalBuilder装饰器后的count参数不刷新呢？

原因是：@Localbuilder装饰的函数绑定在父组件上，状态变量刷新机制是刷新本组件以及其子组件，对父组件无影响，所以无法引发刷新。而若使用@Builder修饰则可引发刷新，原因是@Builder改变了函数的this指向，此时函数被绑定到子组件上，故能引发UI刷新。

3、总结

@LocalBuilder与@Builder之处在于：

@LocalBuilder可以保证this永远指向创建该函数的组件，this不会因为传递而发生变化。
由于状态变量的刷新机制为刷新本组件以及其子组件，因此，当@LocalBuilder被传递到子组件时，由于this指向了父组件，因此，引入入参不会引起组件的刷新。

鸿蒙UI开发——Builder与LocalBuilder对比

1、概述在ArkUI中，有的朋友应该接触过Builder和LocalBuilder。其中有了LocalBuilder的存在，是为了解决组件的父子关系和状态管理的父子关系保持一致的问题。这里面最直观的表现则是this的指向问题与组件刷新问题，本文对Builder与LocalBu…...

编程日记 2025/7/7 0:13:31

FFT加窗和抽取滤波

FFT加窗在信号处理中，为了减少频谱泄漏（Spectral Leakage），在进行快速傅里叶变换（FFT）时通常会采用加窗（Windowing）技术。包括常见的窗函数及其特性对比。 MATLAB FFT 加窗流程采…...

编程日记 2025/6/27 23:26:56

CentOS 10:启动telnet服务

参考， 鳥哥私房菜 - 第七章、網路安全與主機基本防護：限制埠口, 網路升級與 SELinux 7.3.3 埠口与服务的启动/关闭及开机时状态设定我们知道系统的 Telnet 服务通常是以 super daemon 来控管的，请您启动您系统的 telnet 试看看。 1 要启动 …...

编程日记 2025/7/6 23:57:07

腾讯位置服务重构出行行业的技术底层逻辑

位置智能：重构出行行业的技术底层逻辑在智慧城市建设与交通出行需求爆发的双重驱动下，位置服务正从工具层跃升为出行行业的核心基础设施。腾讯位置服务以“连接物理世界与数字空间”为核心理念，通过构建高精度定位、实时数据融合、智能决策…...

编程日记 2025/7/6 23:51:40

webpack5所用依赖以及对应的版本

所有依赖以及版本 {"name": "market-web","version": "0.1.0","private": true,"scripts": {"dev": "cross-env NODE_ENVdevelopment webpack serve --config ./vue.config.js","buil…...

编程日记 2025/6/27 23:18:05

vue-cli 构建打包优化（JeecgBoot-Vue2 配置优化篇）

项目：jeecgboot-Vue2 在项目二次开发后，在本人电脑打包时间为3分35秒左右 webpack5默认优化： Tree Shaking（摇树优化）：删除未使用的代码base64 内联： 小于 8KB 的资源（图片等&…...

编程日记 2025/6/27 23:03:27

Webpack 分包策略详解及实现

Webpack 的分包策略（Code Splitting）是优化前端应用性能的重要手段，它能将代码拆分成多个 bundle，实现按需加载或并行加载，从而减少初始加载时间。分包策略的必要性在大型项目中，如果将所有代码打包到一…...

编程日记 2025/6/27 23:25:09

大模型微调与高效训练

随着预训练大模型（如BERT、GPT、ViT、LLaMA、CLIP等）的崛起，人工智能进入了一个新的范式：预训练-微调（Pre-train, Fine-tune）。这些大模型在海量数据上学习到了通用的、强大的表示能力和世界知识。然而&…...

编程日记 2025/6/27 22:58:31

postgreSQL日常维护

目录登录数据库数据库操作列出列出库创建库删除库切换库查看库的大小数据表操作列出表创建表复制表删除表查看表的结构模式操作命令创建模式默认模式删除模式查看所有模式在指定模式中创建表切换当前模式查看当前所在schema 查看搜索…...

编程日记 2025/6/27 23:16:31

数据直观分析与可视化

数据直观分析与可视化一、数据的直观分析核心价值数据的直观分析旨在通过视觉化的方式，帮助人们更直观、更快速地理解数据的特征和模式，从而发现趋势、异常值、分布情况以及变量之间的关系，为决策提供支持。数据可视化与信息图形、信息可…...

编程日记 2025/6/27 23:01:38

BeamDojo: Learning Agile Humanoid Locomotion on Sparse Footholds

BeamDojo: Learning Agile Humanoid Locomotion on Sparse Footholds 研究动机解决方案技术路线踏脚点奖励双Critic进行稀疏奖励学习两阶段学习地形感知运动马尔可夫决策空间Sim2Real 附录实验结果 BeamDojo: Learning Agile Humanoid Locomotion on Sparse Footholds 研究动机…...

编程日记 2025/6/30 9:02:25

Spark大数据分与实践笔记（第五章 HBase分布式数据库-02）

文章目录每日一句正能量第五章 HBase分布式数据库章节概要5.2 HBase的集群部署每日一句正能量人有三样东西是无法隐瞒的，咳嗽，穷困和爱，你想隐瞒越欲盖弥彰。人有三样东西是不该挥霍的，身体，金钱和爱，你…...

编程日记 2025/6/27 23:40:19

【面经分享】微派网络一面

HashMap 如何解决哈希冲突？ HashMap 是拉链法解决。发生哈希冲突时，同一个槽位上，会形成一个链表。一个槽位上的节点达到树化的阈值后，会树化为红黑树。拉链法：哈希冲突时，同一个哈希槽拉成一个链表…...

编程日记 2025/6/27 23:35:20

【寻找Linux的奥秘】第七章：虚拟地址空间

前言本专题将基于Linux操作系统来带领大家学习操作系统方面的知识以及学习使用Linux操作系统。上一章我们简单认识了环境变量，本章将讲解操作系统中另一个重要的概念——程序地址空间。 1. 初步认识之前在我们学习C语言和C时我们知道，在我们的程序中不…...

编程日记 2025/7/6 23:45:51

网络安全-等级保护(等保) 2-0 等级保护制度现行技术标准

################################################################################ 第二章：现行等保标准要求，通过表格方式详细拆分了等保的相关要求。 GB 17859-1999 计算机信息系统安全保护等级划分准则【现行】 GB/T22240-2020 《信息安全技术…...

编程日记 2025/6/27 23:03:48

Linux：进程信号---信号的保存与处理

文章目录 1. 信号的保存1.1 信号的状态管理 2. 信号的处理2.1 用户态与内核态2.2 信号处理和捕捉的内核原理2.3 sigaction函数 3. 可重入函数4. Volatile5. SIGCHLD信号序：在上一章中，我们对信号的概念及其识别的底层原理有了一定认识，也知道…...

编程日记 2025/6/27 23:05:17

【Linux】C语言模拟实现shell命令行（程序替换原理）

目录一、自动化构建工具（makefile） 二、输出提示符三、获取用户输入的数据四、将用户输入的指令字符串进行分割： 五、执行用户输入的命令六、发现cd命令用不了（内建命令） 原因在于： 七、处理内…...

编程日记 2025/7/6 23:41:24

WordPress Madara插件存在文件包含漏洞(CVE-2025-4524)

免责声明本文档所述漏洞详情及复现方法仅限用于合法授权的安全研究和学术教育用途。任何个人或组织不得利用本文内容从事未经许可的渗透测试、网络攻击或其他违法行为。使用者应确保其行为符合相关法律法规，并取得目标系统的明确授权。对于因不当使用本文信息而造成的任何直…...

编程日记 2025/6/27 23:13:22

【Java】泛型在 Java 中是怎样实现的?

先说结论 , Java 的泛型是伪泛型 , 在运行期间不存在泛型的概念 , 泛型在 Java 中是编译检查运行强转实现的泛型是指允许在定义类 , 接口和方法时使用的类型参数 , 使得代码可以在不指定具体类型的情况下操作不同的数据类型 , 从而实现类型安全的代码复用的语言机制 . …...

编程日记 2025/6/27 23:09:10

Lambda表达式的高级用法

今天来分享下Java的Lambda表达式，以及它的高级用法。使用它可以提高代码的简洁度，使代码更优雅。一、什么是lambda表达式 Lambda 表达式是 Java 8 引入的特性，用于简化匿名内部类的语法，使代码更简洁，尤其在处理函…...

编程日记 2025/7/6 23:40:26

ctfhub技能书http协议

http://challenge-ffe8afcf1a75b867.sandbox.ctfhub.com:10800/index.php curl -v -X CTFHUB http://challenge-ffe8afcf1a75b867.sandbox.ctfhub.com:10800/index.php curl：用于发送 HTTP 请求的命令行工具。 -v（--verbose）：开启…...

编程日记 2025/6/27 23:04:47

面试题 - 微服务相关的经典问题（33道）

1.什么是微服务？ 微服务（Microservices）是一种软件架构风格，将一个大型应用程序划分为一组小型、自治且松耦合的服务。每个微服务负责执行特定的业务功能，并通过轻量级通信机制（如HTTP）相互协作…...

编程日记 2025/6/27 22:59:12

在C#中对List＜T＞实现多属性排序

本文介绍了四种实现多级排序的方法：1. LINQ链式调用：使用OrderBy和ThenBy实现多级排序，直观易读，适合动态需求，返回新列表。2. 自定义比较器（IComparer）：适用于复杂或高频排序&#…...

编程日记 2025/6/27 23:30:23

C++初阶-vector的模拟实现3

目录 1.预备知识：initializer_list 1.1初步了解 1.2关于initializer_list的deepseek的回答 C中的 std::initializer_list 主要特性常见用途 1. 接受列表的构造函数和函数 2. 基于范围的 for 循环重要注意事项实现示例 2.vector::vector(initializer_li…...

编程日记 2025/6/27 23:34:45

详解鸿蒙仓颉开发语言中的日志打印问题

一门新的开发语言在诞生初期，由于它本身的特性和使用人数暂时较少，会容易出现一些大家不太容易理解的问题，或者说有一些坑。今天就详细分享一下仓颉开发语言中的日志打印相关内容，带大家踩一踩坑。 AppLog 在新创建的项目中&…...

编程日记 2025/6/27 23:25:29

dify基于文本模型实现微调Fine-tune语料构造工作流

主要是分为5个部分。分别是：开始、文档提取器、代码执行、LLM大语言模型、结束 5个部分打开dify，创建一个空白页面-选择工作流，我们给应用起个名字。创建完成后，进入工作流画布界面开始在开始节点中新建2个输入参数。1个是用…...

编程日记 2025/6/27 23:36:39

手机充电协议

1、手机快充公有：PD、QC(高通骁龙芯片） 私有： 华为：FCP（fast charge protocol) 、SCP( super charge protocol) 、小米： Mi Turbo Charge oppo：VOOC/SuperVOOC vivo：FlashCharge、…...

编程日记 2025/6/27 23:15:32

HarmonyOS 应用开发，如何引入 Golang 编译的第三方 SO 库

本指南基于笔者临时修复的 ohos_golang_go 项目fork，解决HO 应用导入 cgo编译产物时的 crash 问题。 1. 下载 ohos_golang_go git clone https://gitcode.com/deslord/ohos_golang_go.git📌 该仓库为笔者临时修复版本，修复了 CGO 编译模式下…...

编程日记 2025/6/27 23:02:36

polarctf-web-[某函数的复仇]

考点： 匿名构造函数(create_function) 题目来源：polarctf-web-[某函数的复仇] 解题： 代码审计： <?phphighlight_file(__FILE__);//flag:/flagif(isset($_POST[shaw])){$shaw $_POST[shaw];$root $_GET[root];if(preg_mat…...

编程日记 2025/6/27 11:49:44

Node.js Express 项目现代化打包部署全指南

Node.js Express 项目现代化打包部署全指南一、项目准备阶段 1.1 依赖管理优化 # 生产依赖安装（示例） npm install express mongoose dotenv compression helmet# 开发依赖安装 npm install nodemon eslint types/node --save-dev1.2 环境变量配置 /…...

编程日记 2025/7/6 4:19:15

华为云Flexus+DeepSeek征文｜Flexus云服务器Dify-LLM资源部署极致体验Agent

前引：重磅来袭！本次以DeepSeek-V3/R1商用大模型和Dify-LLM应用平台一键部署为核心，专为新手打造“开箱即用”的AI开发体验。无论你是想快速搭建企业级AI应用，还是探索大模型落地的无限可能，只需跟随小编实现三步走&…...

编程日记 2025/6/27 23:23:00

Java详解LeetCode 热题 100(18):LeetCode 73. 矩阵置零（Set Matrix Zeroes）详解

文章目录 1. 题目描述2. 理解题目3. 解法一：使用两个额外数组标记法3.1 思路3.2 Java代码实现3.3 代码详解3.4 复杂度分析3.5 适用场景 4. 解法二：使用矩阵的第一行和第一列作为标记4.1 思路4.2 Java代码实现4.3 代码详解4.4 复杂度分析4.5 适用场景 5. …...

编程日记 2025/6/27 20:33:42

MySQL刷题 Day08

LC 1341电影评分本题思路简单，但一不注意就错了 ： 不难想到用union，写出如下代码： (select u.name results from MovieRating mr left join Users u on mr.user_id u.user_id group by mr.user_id order by count(mr.user_id…...

编程日记 2025/6/29 4:32:14

linux查看本机服务器的外网IP命令

在 Linux 中查看本机服务器的外网 IP（公网 IP）可以通过以下几种方法： 1. 使用 curl 查询外部服务（推荐） curl ifconfig.me或： curl icanhazip.com或： curl ipinfo.io/ip这些服务会返回你的公…...

编程日记 2025/6/27 23:14:10

DVWA-XSS

DOM low 这是一个下拉框的形式，但是如果我们不让他等于English呢，换成js代码呢？ <script>alert(xss);</script> Medium <script> 标签，但仅使用简单的字符串匹配进行替换（比如移除 "<scr…...

编程日记 2025/6/29 6:03:56

第15天-NumPy科学计算实战：从基础到图像处理

一、NumPy核心优势高效数组运算：矢量操作比纯Python快10-100倍广播机制：不同形状数组的算术运算内存优化：连续内存块存储，支持大数据处理丰富API：线性代数、傅里叶变换、随机数生成等二、环境准备 pip install numpy matplotlib 三、基础操作演示 1. 创建数组 im…...

编程日记 2025/6/27 14:47:12

Spring Boot + +小程序，快速开发零工市场小程序

现在零工经济发展的越来越好，不止是很多人想要利用空余时间找零工赚外快，也有很多企业有灵活用工的需求，根据这样的需求，我们利用Spring Boot 和小程序，快速开发出了零工市场小程序。利用 Spring Boot 开发零工市场小…...

编程日记 2025/6/27 23:02:47

Vue 3.0中核心的Composition API

在当今快速发展的前端生态系统中，Vue 3.0以其革命性的Composition API重新定义了组件开发的范式。作为Vue框架的一次重大进化，Composition API不仅解决了Options API在复杂组件中面临的逻辑复用和组织难题，更为开发者提供了更灵活、更强大的代…...

编程日记 2025/6/27 22:58:29

洛谷B3840 [GESP202306 二级] 找素数

题目描述小明刚刚学习了素数的概念：如果一个大于 1 的正整数，除了 1 和它自身外，不能被其他正整数整除，则这个正整数是素数。现在，小明想找到两个正整数 A 和 B 之间（包括 A 和 B）有多少个素数…...

编程日记 2025/6/27 23:18:47

Axure设计之带分页的穿梭框原型

穿梭框（Transfer）是一种常见且实用的交互组件，广泛应用于需要批量选择或分配数据的场景。一、应用场景其典型应用场景包括： 权限管理系统：批量分配用户角色或系统权限数据筛选工具：在大数据集中选择特…...

编程日记 2025/6/27 23:22:10

VsCode开发环境之Node.js离线部署

1.下载node部署文件地址为：CNPM Binaries Mirror 2.下载后解压 3.验证版本 4.配置环境变量 5.外网寻找一个对应项目的npm文件--node_modules 6.node_modules文件夹复制到node.js的路径下 7.接着就可以正常运行了。...

编程日记 2025/6/29 0:47:53

补充Depends 和 request: Request 依赖注入用法的注意事项

不要在非路由函数（如类的 __init__ 方法或普通模块函数）中直接使用 Depends() 或 request。 Depends 和 request: Request 是 FastAPI 提供的依赖注入机制的一部分，仅适用于FastAPI 路由函数或由 FastAPI 调用的依赖函数中。在类初始化、模块…...

编程日记 2025/6/28 23:57:22

uniapp-商城-64-后台商品列表（商品修改---页面跳转，深浅copy应用，递归调用等）

完成了商品的添加和展示，下面的文字将继续进行商品页面的处理，主要为商品信息的修改的页面以及后天逻辑的处理。本文主要介绍了商品信息修改页面的实现过程。首先，页面布局包括编辑和删除功能，未来还可添加上架和下架按钮。通过c…...

编程日记 2025/6/27 23:08:28

【MySQL】联合查询（上）

目录一. 什么是联合查询二. 笛卡尔积三. 内连接查询示例演示四. 外连接示例演示五. 自连接自连接示例演示一. 什么是联合查询在之前学习的增删改查中都是对于单表进行查询，但是因为在数据库设计时需要遵循范式的要求，数据就会被拆分到多…...

编程日记 2025/6/27 23:33:05

Model 是 Agent 的大脑（以camel为例）

Model 是 Agent 的大脑，负责处理所有输入和输出数据。通过有效调用不同的模型，智能体可以根据任务需求执行文本分析、图像识别和复杂推理等操作。CAMEL 提供了一系列标准和可定制的接口，并与各种组件无缝集成，以赋能大语言模型&am…...

编程日记 2025/6/27 23:32:48

Linux条件变量

在 Linux 系统中，pthread_cond_init() 函数和条件变量（Condition Variable）是多线程编程中用于线程同步的核心机制。它们通过协调线程间的等待与通知逻辑，解决共享资源的竞争问题。以下从功能、工作机制、使用场景和注意事项等方面…...

编程日记 2025/6/27 23:17:20

k8s-NetworkPolicy

在 Kubernetes 中，NetworkPolicy 是一种资源对象，用于定义 Pod 之间的网络通信策略。它允许你控制哪些 Pod 可以相互通信，以及如何通信。通过使用 NetworkPolicy，可以实现更细粒度的网络访问控制，增强集群的安全性。 1…...

编程日记 2025/6/29 4:19:05

什么是“架构孤岛”？如何识别与整合？为什么现代企业在追求敏捷开发的同时，反而更容易陷入架构孤岛陷阱？

在现代信息技术飞速发展的时代，系统架构日益复杂，组织在构建与演进其信息系统时，面临着前所未有的挑战。然而，就在不断追求敏捷性、可扩展性与数字化创新的过程中，一个被广泛忽视却日益严峻的问题悄然浮现——“架构孤岛”。它们像岛屿一样，彼此孤立，通信不畅，数据难以…...

编程日记 2025/6/27 23:33:34

nfs存储IO等待,导致k8s业务系统卡慢问题处理

注:服务器配置:64C,128G,麒麟v10系统,系统磁盘使用空间(5T)均低于50%,存储磁盘iops约为800左右发现业务系统卡慢,使用top 命令查看.系统负载较高长期保持在60以上,发现wa值的指标参数长期高于15,返现CPU用于写入磁盘IO等待的时间较高,系统的磁盘I/O压力较大. 配合开发查看日志…...

编程日记 2025/6/27 23:39:44

如何使用两块硬盘作为 Ubuntu24 的系统盘，实现坏掉一块不影响系统运行。

最近我想使用Ubuntu组一个NAS系统，想实现系统盘冗余，各位大佬可以给点建议吗。 Deep Seek 为了实现两块硬盘作为 Ubuntu 24 系统盘的冗余配置（RAID 1），确保一块硬盘损坏时系统仍可运行，以下是详细步骤&am…...

编程日记 2025/6/29 1:39:53

1、概 述

2、引入问题

2.1. this指向问题

2.2. 组件刷新问题

3、总 结

相关文章：

1、概述

3、总结