vue-cli监听组件加载完成的方法
在使用vue-cli开发项目时遇到过一个问题，要求是页面组件全部加载完成后再执行某个函数，给上代码参考，方法可能有点笨，好在实现了功能。
1、安装vuex
npminstallvuex--save
2、在项目目录下找到store.js文件
importVuefrom'vue'
importVuexfrom'vuex'
Vue.use(Vuex)
//监听nav模块加载完
constm_classifyone={
state:{
count:0
},
mutations:{
increment(state){
state.count++
}
}
}
conststore=newVuex.Store({
modules:{
a:m_classifyone,
b:m_classifyonepage,
c:currentpage
}
})
exportdefaultstore;
3、在子组件中
created(){
//数据请求完成后
this.$post(address.addr+controll.mallcontroll+'/getMallHome').then(message=>{
//这里使用箭头函数是为了不改变this指向
this.$store.commit('increment');
})
}
4、通过store判断子组件数据加载完成
mounted(){
//通过store判断当前组件是否加载完成，加载完成执行页面框架
varcount=0;
letcountfn=function(count){
if(count>0){
//子组件加载完成清除计时器，调用方法
clearInterval(st)
pagef.pageFramefn();
}
}
letst=setInterval(e=>{
count=this.$store.state.a.count;
countfn(count)
})
//通过store判断当前组件是否加载完成，加载完成执行页面框架
}
以上这篇vue-cli监听组件加载完成的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。
热门推荐
3 祝福语简短的微信
10 幼儿祝福语大全简短贺卡
11 感谢教官文案祝福语简短
12 鼠年同事祝福语简短创意
13 元旦祝福语 简短独特群发
14 妈咪跟我生日祝福语简短
15 给儿子新婚祝福语简短
16 伴娘祝福语长文案简短
17 恭喜高考完祝福语简短
18 生日祝福语送老公简短