Vue3 emits 结合回调函数的使用

news/2024/7/7 21:02:40

回调函数

先说下啥是回调函数,举个例子,当A方法调用B方法时,A方法会传一个方法作为参数给B方法,B方法中可以去按照逻辑执行A传递过的函数,就是回头再调用A方法传参给的方法。有点绕哈,写段代码参考下

const funA = () => {
	// 业务逻辑 .....
	
	funB('布拉布拉', 123, () => {
		// 回调的业务逻辑
	});
};


/**
* B 方法 最好加上ts约束
* @param param1 参数1
* @param param2 参数2
* @param fun1   参数函数1,这里是一个函数
*/
const funB = (param1:string, param2: number, fun1: Function){
	// 拿到参数做业务 ....

	// 执行参数函数,这里会执行到A方法中传递的方法
	fun1();
}

其实vue中有很多这种示例,如vue响应式的逻辑处理有很多都是将函数存储到map set集合中,然后去做逻辑,这里主要的思路就是方法传参不仅可以传递普通参数,也可以传递函数,集合存储亦是可以存储函数等待特殊类型。

emits调用回调函数

回到主题哈,结合上面的代码这里就很好理解了。正常emits用于子父组件的通信,子组件通信父组件,使用回调函数就是想父组件接受了子组件的消息后再回调到子组件中。

// 子组件
emtis('demoBack', data, () => {
	// 回调业务
});


// 父组件
<子组件 @demoBack="handleDemoBack">

const handleDemoBack = (data, fun) => {
	// data 是传递的数据

	// 执行回调函数
	fun();
};

http://lihuaxi.xjx100.cn/news/1985723.html

相关文章

如何预防服务器IP被劫持,危害有什么?

服务器IP被劫持是一种严重的网络安全问题&#xff0c;攻击者通过篡改服务器的IP地址&#xff0c;将网络流量重定向到恶意服务器或网站&#xff0c;导致用户无法正常访问目标服务器&#xff0c;并可能面临数据泄露、恶意软件感染等安全风险。了解服务器IP被劫持的危害和预防措施…

构建未来的数字世界:创新开放API接口认证解决方案

目录 1、引言 1.1 数字世界的发展 1.2 API接口的重要性 1.3 API接口认证的挑战 2、现有的API接口认证解决方案 2.1 基于令牌的认证方法 2.2 OAuth认证 2.3 OpenID认证 2.4 API密钥认证 3、创新开放API接口认证解决方案 3.1 双因素认证 3.2 生物特征认证 3.3 区块链…

Java面试题136-150

36、用JDBC如何调用存储过程 代码如下&#xff1a; package com.huawei.interview.lym; import java.sql.CallableStatement; import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException; import java.sql.Types; public class JdbcTest…

AI对比:ChatGPT和文心一言的区别和差异

目录 一、ChatGPT和文心一言大模型的对比分析 1.1 二者训练的数据情况分析 1.2 训练大模型数据规模和参数对比 1.3 二者3.5版本大模型对比总结 二、ChatGPT和文心一言功能对比分析 2.1 二者产品提供的功能情况分析 2.2 测试一下各种功能的特性 2.2.1 文本创作能力 2.2…

21.云原生之GitLab pipline语法(CI基础)

云原生专栏大纲 文章目录 gitlab-ci.yml 介绍GitLab中语法检测gitlab-ci.yml 语法job定义作业before_script和after_scriptstages定义阶段tages指定runnerallow_failure运行失败when控制作业运行retry重试timeout超时parallel并行作业only & exceptrulescache 缓存cache:p…

代码随想录算法训练营第二十五天| 491.递增子序列* 46.全排列* 47.全排列 II

491.递增子序列 代码随想录 视频讲解&#xff1a;回溯算法精讲&#xff0c;树层去重与树枝去重 | LeetCode&#xff1a;491.递增子序列_哔哩哔哩_bilibili class Solution {List<List<Integer>> ans new ArrayList<>();List<Integer> list new Arra…

[晓理紫]每日论文分享(有中文摘要,源码或项目地址)-大模型、扩散模型、视觉导航

专属领域论文订阅 关注{晓理紫|小李子}&#xff0c;每日更新论文&#xff0c;如感兴趣&#xff0c;请转发给有需要的同学&#xff0c;谢谢支持 如果你感觉对你有所帮助&#xff0c;请关注我&#xff0c;每日准时为你推送最新论文。 分类: 大语言模型LLM视觉模型VLM扩散模型视觉…

软件安全测试的重要性简析,专业安全测试报告如何申请?

在当今数字化时代&#xff0c;软件在我们的日常生活中扮演着至关重要的角色&#xff0c;但也带来了各种潜在的安全威胁。为了保障用户的信息安全和维护软件的可靠性&#xff0c;软件安全测试显得尤为重要。 软件安全测试是指通过一系列的方法和技术&#xff0c;对软件系统中的…