鸿蒙开发之组件间方法传递(方法回调)

目前使用的方式有两种,一种是父子组件方法传递,一种是系统提供的emitter。

一、父子组件方法传递

1.1 使用场景

当我们父组件中有一个方法,需要子组件在修改完数据后回调父组件的方法时候。有点抽象:这样解释一下,父组件A中创建了子组件B,A中一个方法是需要B端更新数据后调用来刷新页面。这样我们就需要将A中的方法传递给子组件B。然后,B端改完数据后调用这个方法。

1.2 伪代码实现
//父组件A中的伪代码//A组件中的方法实现startCalcuteMoney() {//。。。。这里进行方法处理}build() {Column() {ListItem() {TopCellItem({startCalcute:this.startCalcuteMoney.bind(this)})}}
}//=========================================////子组件B中的伪代码@Component
struct TopCellItem {//接受父类传递的方法startCalcute:() => voidbuild() {Column(){Text('点击调用父组件方法').fontSize(20).onClick(() => {this.startCalcute()})}
}

比较好理解,不过需要注意的是父组件在传递给子组件方法的时候需要bind(this)。

当B组件TopCellItem点击Text的时候就可以回调父组件的方法了。

二、emitter

可以先看一下官方文档,解释的比较清晰。

2.1 使用场景

这个对于原生iOS开发来说就像notification通知,或者swift的EventBus。可以实现跨页面,跨组件的一对多的传递。例如主题设置,我在设置完主题颜色的时候,需要所有监听到的地方发生更改。这就需要用到emitter了。

2.2 伪代码实现
//发送信号的方法saveportfoilRate() {//发送信号let eventData = {data: { //发送的数据"rate": this.portfolioRate,}};let innerEvent = {eventId: 11, //发送的ID,需要跟监听方一致priority: emitter.EventPriority.HIGH};emitter.emit(innerEvent, eventData);}//=====================================================//监听信号的地方listenRateChange() {let innerEvent = {eventId: 11 //监听的ID,需要跟发送方一致};function EmitterCallback(eventData) {//处理收到的数据}emitter.on(innerEvent, EmitterCallback.bind(this));}

同样需要注意的是,在监听信号的地方需要bind(this)。

当组件A中调用发送信号的地方时候,组件B在监听的地方就可以收到了。需要注意的是需要先监听再发送。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/711238.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

深度学习-Pytorch运算的基本数据类型

深度学习-Pytorch模型运算的基本数据类型 用pytorch构建模型,并训练模型,得到一个优化的模型,那么模型构造的数据类型怎样的? 数据分析 数据分析-Pandas如何转换产生新列 数据分析-Pandas如何统计数据概况 数据分析-Pandas如…

Three.js-04轨道控制器

1.导入 说明:相机围绕目标进行轨道运动。也就是可以通过鼠标拖拽进行移动视角。 import { OrbitControls } from three/addons/controls/OrbitControls.js; 2.使用 说明:构造controls对象,再调用update方法;为了使效果更为明显…

十二、Qt自定义Widget组件、静态库与动态库

一、自定义Widget组件 1、自定义Widget组件 使用步骤采用提升法(promotion)重新定义paintEvent事件 2、实现程序 (1)创建项目,基于QWidget (2)添加类,为Widget组件提升类 #inclu…

Spring Boot 集成 Quartz 实现定时任务

Spring Boot 集成 Quartz 实现定时任务 在Spring Boot应用中,我们经常需要执行一些定时任务,如每天发送报表、定时更新数据库等。虽然Spring Framework自带了一个简单的定时任务功能(Scheduled),但在一些复杂场景下&a…

Vue3 在SCSS中使用v-bind

template 先创建一个通用的页面结构 <template><div class"v-bubble-bg"></div> </template>js 在JS中先对需要用的数据进行定义&#xff1a; 可以是参数&#xff0c;也可以是data <script setup>const props defineProps({bgCol…

cURL 命令中有$的问题

最近学会使用cURL来快速访问网络资源&#xff0c;确实很好用&#xff0c;但在使用过程中遇到一个奇怪的问题&#xff0c;多方查询也没有找到现成答案&#xff0c;最后经摸索终于解决&#xff0c;特记录如下。 我们一般访问网站使用Chrome浏览器获取的cURL命令大概是这个样子&am…

gpt批量原创文章生成器,不限制内容的生成器

在当今的数字化时代&#xff0c;内容创作是网站持续发展的重要组成部分。然而&#xff0c;对于拥有大量内容需求的网站来说&#xff0c;手动创作文章可能会耗费大量时间和精力。为了解决这一问题&#xff0c;许多GPT&#xff08;生成式预训练模型&#xff09;文章生成软件应运而…

【重温设计模式】外观模式及其Java示例

设计模式及外观模式介绍 在编程世界中&#xff0c;设计模式就如同自然界的法则&#xff0c;是一种反复出现在各种情况下的通用解决方案。设计模式可以分为创建型、结构型和行为型三大类&#xff0c;每一类都有其独特的应用场景和解决问题的方式。今天&#xff0c;我们要重点解…

【HbuilderX】 uniapp实现 android申请权限 和 退出app返回桌面

目录 android申请权限&#xff1a; 监听用户是否开启权限或关闭权限&#xff1a; 退出app返回桌面&#xff1a; android申请权限&#xff1a; 首先在 manifest.json 内添加你所需要用到权限 添加权限插件 permission.js 一次就好1/权限插件 - Gitee.comhttps://gitee.co…

数据库分库分表中间件选择

目前分库分表的中间件有三种设计思路&#xff0c;分别是&#xff1a; 采用分散式架构&#xff0c;适用于用Java开发的高性能轻量级OLTP应用程序&#xff0c;以Sharding-JDBC为代表。采用中间层Proxy架构&#xff0c;提供了静态输入和所有语言支持&#xff0c;适用于OLAP应用程…

MATLAB环境下基于小波和滤波器组的音频信号处理

音频分类研究的重点&#xff0c;一方面在于音频特征的提取和选择&#xff0c;通常来说数据集和特征集在分类系统中有着极为重要的作用&#xff0c;离开了对数据集的处理、对特征集中特征的提取和选择&#xff0c;分类结果必将产生巨大误差。对于提高音频分类系统的分类准确度和…

vulnhub-----Hackademic靶机

文章目录 1.C段扫描2.端口扫描3.服务扫描4.web分析5.sql注入6.目录扫描7.写马php反弹shell木马 8.反弹shell9.内核提权 1.C段扫描 kali:192.168.9.27 靶机&#xff1a;192.168.9.25 ┌──(root㉿kali)-[~] └─# arp-scan -l Interface: eth0,…

Docker容器(3)单容器管理

一、单容器 1.1概念简介 Docker三个重要概念: 仓库(Repository); 镜像(Image); 容器(Container). *Docker的三个重要概念是仓库(Repository)、镜像(Image)和容器(Container)**。具体如下&#xff1a; **镜像(Image)**&#xff1a;Docker镜像是创建容器的基础&#xff0c;它类似…

『NLP学习笔记』图解Word2vec(The Illustrated Word2vec)

图解Word2vec(The Illustrated Word2vec) 文章目录 一. 词嵌入(word embedding)1.1. 个性嵌入:你是什么样的人?1.2. 词嵌入1.3. 类比1.4. 语言模型1.5. 语言模型训练1.6. 顾及两头(上下文)1.7. Skip-gram模型1.8. 重新审视训练过程1.9. 负例采样1.10. 基于负例采样的Skip…

Maven面试题

以下是一些关于Maven的经典面试题以及它们的答案&#xff1a; 1、什么是Maven&#xff1f; Maven是一个项目管理工具&#xff0c;用于构建、管理、发布Java项目。 2、为什么要使用Maven而不是手动管理项目依赖&#xff1f; Maven提供了依赖管理、统一的构建、打包、文档生…

Linux DKMS

DKMS&#xff08;Dynamic Kernel Module Support&#xff09;是一个框架&#xff0c;用于构建和安装内核模块。它允许第三方内核模块在系统内核升级时自动重新构建和安装&#xff0c;从而确保这些模块与新内核版本兼容。 DKMS的工作原理是将内核模块的源代码和安装脚本存储在一…

Google索引脚本:快速索引你的网站

公众号&#xff1a;【可乐前端】&#xff0c;每天3分钟学习一个优秀的开源项目&#xff0c;分享web面试与实战知识。 每天3分钟开源 hi&#xff0c;这里是每天3分钟开源&#xff0c;很高兴又跟大家见面了&#xff0c;今天介绍的开源项目简介如下&#xff1a; 仓库名&#xff1…

园区停车管理系统的设计与实现

** &#x1f345;点赞收藏关注 → 私信领取本源代码、数据库&#x1f345; 本人在Java毕业设计领域有多年的经验&#xff0c;陆续会更新更多优质的Java实战项目希望你能有所收获&#xff0c;少走一些弯路。&#x1f345;关注我不迷路&#x1f345;** 一 、设计说明 1.1 选题…

【前端素材】推荐优质在线通用果蔬商城电商网页eStore平台模板(附源码)

一、需求分析 1、系统定义 通用果蔬网站是指专门提供各类果蔬产品展示和销售的在线平台。它将不同种类的新鲜水果、蔬菜、干果、坚果等聚集在一起&#xff0c;为消费者提供方便、快捷的购物渠道。 2、功能需求 通用果蔬网站是指专门提供各类果蔬产品展示和销售的在线平台。…

Nginx常用配置--负载均衡服务

可以将 nginx 作为一个非常高效的 HTTP 负载均衡器&#xff0c;将流量分配到多个应用服务器上&#xff0c;并通过 nginx 提高 Web 应用的性能、可扩展性和可靠性。 nginx 可以通过添加一个 upstream&#xff0c;来实现 nginx 的负载均衡功能。 upstream myserver {server 192…