Vue父子组件执行顺序问题
场景:父组件的created中有个axios请求,请求返回后将结果放到query中,希望等axios返回并写入query再执行子组件mounted中的内容,但是总是先执行子组件的mounted,之后父组件axios才返回结果
(父组件axios的返回可能为空,所以不能在子组件中query的内容是否为空,而且子组件直接加watch的话刷新当前页会有问题)
尝试过了在子组件的mounted方法中加setTimeout,也不行
相关代码
父组件
created() {
testPost().then(res => {
if (res.data.length > 0) {
this.numList = res.data.map(item => item)
this.num = this.numList[0]
this.$router.push({
query: {
cid: this.num
}
})
}
}).catch(err => {
console.log(err)
})
}
子组件
mounted() {
if (this.$route.query.cid) {
//todo
}else{
//todo
}
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
把子组件写在
mounted
中的方法抽离出来写在methods
里面,父组件拿到回调后主动去触发子组件的方法1.在子组件上加个v-if等拿到query之后再渲染
2.子组件watch query
既然是父子组件数据的传递是否可以直接采用prop来传递,
子组件 监听prop属性的变化, 然后执行 你需要执行的函数。