Vue生命周期内发起ajax请求,因为请求异步性,并且生命周期函数也是异步的,导致子组件获取结果滞后,如果才能保证同步?

1、项目有这样的需求、或者是设计吧。项目在浏览器一打开,初始化时需要向服务端发起请求,获取初始化参数,而这些参数需要在所有的子模块(组件)中需要用到。2、现在的实现思路是在main.js中,在created钩子函数发起请求,将结果存放在vuex中用于各个模块共享。其他子模块在mounted钩子函数中拿取vuex中的参数,再进行其他处理。各个模块通过路由链接。但是因为axios请求的异步性,导致子组件开始mounted时,之前的请求结果还没返回。3、后来在试着在main.js的created钩子函数中使用awaitasyncpromise等机制来保证同步,后来还是不行,awaitasync不能阻塞vue生命周期钩子函数的执行。这就导致获取数据一直滞后。4、有大神能提供解决方法嘛?或者我的思路有问题?
5、main.js:
newVue({
render:h=>h(App),
store:store,
methods:{
asyncseturl(){
},
get(){
var_this=this;
returnnewPromise((resolve)=>{
_this.$axios.get(require.systemInfo).then(function(response){
resolve(response.data)
}).catch(function(err){
})
})
},
b(){
window.console.log("处理后面的函数!")
}
},
asynccreated(){
window.console.log("开始发送请求!")
varv=awaitthis.get();
window.console.log(v)
this.$store.commit('setUrls',v);
this.b();
/*this.iserverUrl=this.$store.state.AppInformation.urls.iserver;*/
}
}).$mount('#app')
慕尼黑5688855
浏览 1412回答 2
2回答
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript