什么?你的全局事件总线无法触发!组件间的无法正常通信!mounted钩子虽然好用,但从组件生命周期加载顺序来说,它并不能总是回应你的期待。

假设当前组件结构为:APP组件 ——> 父组件 ——>子组件

当刷新子组件所在页面时,生命周期执行顺序为(只写关键的钩子):APP组件beforemount父组件beforecreate beforemount 再到 子组件beforecreate  mounted,当子组件挂载完毕也就是mounted后 才是父组件mounted 然后 APP组件mounted

通俗的说就是:在APP组件的beforemount 到 mounted之间要从头到尾挂载完 父组件

                        在父组件的beforemount 到 mounted之间要从头到尾挂载完子组件

所以在子组件的mounted钩子里是无法访问父组件mounted里的任何方法的,如果将给数据赋值如读取sessionstorage中的值给到vuex,刷新子组件所在页面,是无法展示数据的

解决办法就是把方法放到父组件的created或者beforemount钩子里

当同级路由跳转时通过全局事件总线传递数据时,生命周期执行顺序:a(mounted) ——>b(beforecreate ——>beforemount) ——>a销毁——>b(mounted)

所以在b的created或者beforemount钩子里绑定事件,在a的beforedestroy钩子处去触发该事件

Logo

前往低代码交流专区

更多推荐