vue.js中鉤子函數是什么

小編給大家分享一下vue.js中鉤子函數是什么，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！

vue.js中有八個鉤子函數，分別是：1、beforeCreate用于創建前；2、created用于創建后；3、beforeMount用于掛載前；4、mounted用于掛載后；5、beforeDestroy用于銷毀前。

vue.js中有八個鉤子函數，分別是：

一、beforeCreate:創建前

1、當前vue實例化的時候會做一個初始化的操作，在這個生命周期函數里面我們可以做初始化的loading

2、在當前函數里面是訪問不到data中的屬性，但是可以通過vue的實例對象進行訪問

二、created:創建后

1、當beforeCreate執行完畢以后，會執行created. 在當前函數中我們可以訪問到data中的屬性

2、當前生命周期函數執行的時候會將data中所以的屬性和methods身上所以的方法添加到vue的實例身上，同時

會將data中所有的屬性添加一個getter/setter方法

3、如果需要進行前后端上數據交互(ajax請求的時候) 需要在當前生命周期中使用

三、beforeMount:掛載前

(渲染)

render函數初次被調用---->數據和模板沒有進行相結合，同時還沒有渲染到html頁面上

可以在此做渲染前data中數據最后的修改

四、mounted:掛載后

1、數據和模板進行相結合，渲染成真實的DOM結構

2、在當前生命周期函數里面我們可以訪問到真實的DOM結構,

3、在vue中我們可以通過$refs來訪問到真實的DOM結構

4、ref類似與id一樣 值必須是唯一的   訪問的時候我們可以通過this.$refs.屬性

五、beforeDestroy:銷毀前

銷毀之前還可以訪問到DOM結構  以及相關的數據(data)

在這個生命周期函數中我們可以將綁定的事件進行移除

六、destroyed:銷毀后

在這個生命周期函數中會將數據和模板之間的關系斷開(不是你的做的)

在這個生命周期函數中我們還是可以訪問到data中的屬性

但是訪問不到真實的DOM結構了

七、beforeUpdate:更新前

只要data中的屬性發生了改變，那么這個生命周期就會執行，render函數再次會執行

在這個生命周期函數中我們可以對數據進行最后的修改，同時也可以訪問到最新的DOM結構和數據

八、updated:更新后

在當前生命周期函數中我們可以訪問到最新的DOM結構(數據更新后最新的DOM結構)和數據

看完了這篇文章，相信你對vue.js中鉤子函數是什么有了一定的了解，想了解更多相關知識，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！