Vue的鉤子函式

2021-08-13 07:34:20 字數 980 閱讀 5095

vue是現在的熱門前端框架之一,採用了虛擬dom,稍微介紹一下虛擬dom的概念。在使用原生js的時候,我們總數需要去獲取dom元素,這樣的話,每次要獲取元素都要操作一次dom,我們就要執行一次,那麼我們就要考慮如何減少操作的次數,虛擬dom就是為這個考慮而設計的。先簡單介紹幾個鉤子函式,因為現在已經跟新到了vue2.0,因此,將主要介紹vue2.0的。

beforecreated:我們在用vue時都要進行例項化,因此,該函式就是在vue例項化是呼叫,也可以將他理解為初始化函式比較方便一點,在vue1.0時,這個函式的名字就是init。

created:在建立例項之後進行呼叫。

mounted:我們可以將他理解為原生js中的window.οnlοad=function(),或許大家也在用jquery,所以也可以理解為jquery中的$(document).ready(function()),相信講解了這兩個例子,也就理解了這個函式的功能了,他的功能就是:在dom文件渲染完畢之後將要執行的函式,該函式在vue1.0版本中名字為compiled。

beforedestroy:該函式將在銷毀例項前進行呼叫

destroyed:改函式將在銷毀例項時進行呼叫

講了上面兩個銷毀函式,如何進行銷毀呢,我們可以使用mounted函式來進行

mounted:function

()

beforecreate:function

(), created:function

(), beforedestroy:function

(), destroyed:function

(), mounted:function

()

上面的**執行後結果為:

vue 鉤子函式

一共有十乙個,但是常見的八個,常用的三四個 beforecreate 建立之前 常用 vue建立之前,data未生產。在beforecreate前,所有的options都會先存到vm.options中,在beforecreate之後,將 options裡的data,props,methods等等乙個...

vue 鉤子函式

beforerouteenter to,from,next 1 this undefined 2 this.data undefined 3 methods 裡面的方法 undefined 4 如果有快取,該方法不會被呼叫 beforecreate 1 如果有快取,該方法不會被呼叫 2 this.d...

vue鉤子函式

前言 鉤子就好像是把人的出生到死亡分成乙個個階段,你肯定是在出生階段起名字,而不會在成年或者死亡的階段去起名字。或者說你想在出生階段去 也是不行的。元件也是一樣,每個階段它的內部構造是不一樣的。所以一般特定的鉤子做特定的事,比如ajax獲取資料就可以在mounted階段。一 vue生命週期簡介 咱們...