Vue3 emits結(jié)合回調(diào)函數(shù)的使用方式
更新時間：2024年12月26日 08:42:08 作者：-小龍人
文章介紹了回調(diào)函數(shù)的概念,并通過一個簡單的例子來說明其工作原理,接著,文章提到在Vue.js中,回調(diào)函數(shù)常用于子父組件之間的通信,父組件可以接受子組件的消息并調(diào)用回調(diào)函數(shù),文章通過代碼示例和解釋,幫助讀者理解回調(diào)函數(shù)在實際開發(fā)中的應用
Vue3 emits結(jié)合回調(diào)函數(shù)使用
回調(diào)函數(shù)
先說下啥是回調(diào)函數(shù)，舉個例子：
當A方法調(diào)用B方法時，A方法會傳一個方法作為參數(shù)給B方法，B方法中可以去按照邏輯執(zhí)行A傳遞過的函數(shù)，就是回頭再調(diào)用A方法傳參給的方法。
有點繞哈，寫段代碼參考下：
const funA = () => {
// 業(yè)務邏輯 .....
funB('布拉布拉', 123, () => {
// 回調(diào)的業(yè)務邏輯
});
};
/**
* B 方法 最好加上ts約束
* @param param1 參數(shù)1
* @param param2 參數(shù)2
* @param fun1 參數(shù)函數(shù)1，這里是一個函數(shù)
*/
const funB = (param1:string, param2: number, fun1: Function){
// 拿到參數(shù)做業(yè)務 ....
// 執(zhí)行參數(shù)函數(shù)，這里會執(zhí)行到A方法中傳遞的方法
fun1();
}
其實vue中有很多這種示例：
如vue響應式的邏輯處理有很多都是將函數(shù)存儲到map set集合中，然后去做邏輯，這里主要的思路就是方法傳參不僅可以傳遞普通參數(shù)，也可以傳遞函數(shù)，集合存儲亦是可以存儲函數(shù)等待特殊類型。
emits調(diào)用回調(diào)函數(shù)
回到主題哈，結(jié)合上面的代碼這里就很好理解了。
正常emits用于子父組件的通信，子組件通信父組件，使用回調(diào)函數(shù)就是想父組件接受了子組件的消息后再回調(diào)到子組件中。
// 子組件
emtis('demoBack', data, () => {
// 回調(diào)業(yè)務
});
// 父組件
<子組件 @demoBack="handleDemoBack">
const handleDemoBack = (data, fun) => {
// data 是傳遞的數(shù)據(jù)
// 執(zhí)行回調(diào)函數(shù)
fun();
};總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
bpmn.js是一個BPMN2.0渲染工具包和web建模器,使得畫流程圖的功能在前端來完成,這篇文章主要給大家介紹了關(guān)于vue3集成bpmn.js的相關(guān)資料,文中通過代碼示例介紹的非常詳細,需要的朋友可以參考下2024-01-01
這篇文章主要介紹了Vue+elementUI導出word打印方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2025-04-04
這篇文章主要介紹了vuex中五大屬性和使用說明(包括輔助函數(shù))，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-05-05
這篇文章主要為大家講解了vue3?keepalive源碼解析解決線上問題，需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07
淺談vue自定義全局組件并通過全局方法 Vue.use() 使用該組件
本篇文章主要介紹了vue自定義全局組件并通過全局方法 Vue.use() 使用該組件，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-12-12
這篇文章主要介紹了vue 解決兄弟組件、跨組件深層次的通信操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
這篇文章主要介紹了詳解Vue數(shù)據(jù)驅(qū)動原理的相關(guān)資料，幫助大家更好的理解和學習vue框架的相關(guān)知識，感興趣的朋友可以了解下2020-11-11
在Vite + Vue3項目中,通過安裝依賴、配置vite.config.js文件、運行構(gòu)建命令,可以完成應用的打包過程,確保檢查構(gòu)建輸出、環(huán)境變量、路由模式以及性能優(yōu)化配置,此外,定期查閱官方文檔和社區(qū)更新,可以獲取最新功能和最佳實踐2026-04-04
響應式就是當對象本身(對象的增刪值)或者對象屬性(重新賦值)發(fā)生變化時,將會運行一些函數(shù),最常見的就是render函數(shù),下面這篇文章主要給大家介紹了關(guān)于Vue3響應式原理的相關(guān)資料,需要的朋友可以參考下2022-12-12
使用vue-element-admin框架調(diào)用后端接口及跨域的問題
這篇文章主要介紹了使用vue-element-admin框架調(diào)用后端接口及跨域的問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-11-11