在使用vue-cli開發項目時遇到過一個問題，要求是頁面組件全部加載完成后再執行某個函數，給上代碼參考，方法可能有點笨，好在實現了功能。

1、安裝vuex

npm install vuex --save

2、在項目目錄下找到store.js文件

import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex) //監聽nav模塊加載完const m_classifyone = { state: { count:0 }, mutations: {  increment (state) {  state.count++ } }}const store = new Vuex.Store({modules: { a: m_classifyone, b: m_classifyonepage, c:currentpage }})export default store;

3、在子組件中

created(){//數據請求完成后this.$post(address.addr+controll.mallcontroll+'/getMallHome').then(message => {//這里使用箭頭函數是為了不改變this指向this.$store.commit('increment');}) }

4、通過store判斷子組件數據加載完成

mounted(){//通過store判斷當前組件是否加載完成，加載完成執行頁面框架var count = 0;let countfn = function(count){if(count>0){//子組件加載完成清除計時器，調用方法clearInterval(st)pagef.pageFramefn();}}let st = setInterval(e => {count = this.$store.state.a.count;countfn(count)})//通過store判斷當前組件是否加載完成，加載完成執行頁面框架}

以上這篇vue-cli監聽組件加載完成的方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持錯新站長站。