Vue中經常使用mounted來完成一個模塊的初始化,它的作用就是在實例掛載后執行某些操作,可以看做是一個生命周期鉤子函數。
mounted() { console.log('mounted'); }
在mounted函數中,我們可以訪問到數據和DOM元素,進行一些初始化的操作。比如我們可以使用JavaScript來獲取瀏覽器窗口的大小,然后做一些自適應頁面的操作。
mounted() { this.getWindowSize(); }, methods: { getWindowSize() { let width = window.innerWidth; let height = window.innerHeight; // 做一些自適應頁面操作 } }
另外,因為mounted是在實例掛載后執行的,所以它在beforeCreate、created、beforeMount這三個生命周期鉤子函數之后執行,在beforeUpdate、updated這兩個函數之前執行。
除此之外,如果需要在DOM更新之后執行某些操作,可以使用vm.$nextTick()方法,在該方法回調中完成操作。
mounted() { this.$nextTick(() =>{ console.log('DOM更新完成'); }); }
上一篇css個人頁面
下一篇mpvue vue 版本