欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue父組件監(jiān)聽子組件生命周期

 更新時(shí)間：2020年09月03日 10:21:53   作者：vickylinj  
這篇文章主要介紹了Vue父組件監(jiān)聽子組件生命周期,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

比如有父組件 Parent 和子組件 Child，如果父組件監(jiān)聽到子組件掛載 mounted 就做一些邏輯處理，可以通過以下寫法實(shí)現(xiàn)：

// Parent.vue
<Child @mounted="doSomething"/>

// Child.vue
mounted() {
 this.$emit("mounted");
}

以上需要手動(dòng)通過 $emit 觸發(fā)父組件的事件，更簡(jiǎn)單的方式可以在父組件引用子組件時(shí)通過 @hook 來監(jiān)聽即可，如下所示：

// Parent.vue
<Child @hook:mounted="doSomething" ></Child>

doSomething() {
  console.log('父組件監(jiān)聽到 mounted 鉤子函數(shù) ...');
},

// Child.vue
mounted(){
  console.log('子組件觸發(fā) mounted 鉤子函數(shù) ...');
},  

// 以上輸出順序?yàn)椋?
// 子組件觸發(fā) mounted 鉤子函數(shù) ...
// 父組件監(jiān)聽到 mounted 鉤子函數(shù) ...

當(dāng)然 @hook 方法不僅僅是可以監(jiān)聽 mounted，其它的生命周期事件，例如：created，updated 等都可以監(jiān)聽。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論