vue页面切换时,页面中的方法执行的顺序踩的坑

当前有个需求:页面相互跳转中,在上一个页面(A页面)结束时使用$emit给父组件传值重置某些数据,在下一个页面(B页面)加载的时候也会给父组件传值给数据赋值。

我的做法是在A中使用 beforeDestroy() 在页面摧毁之前向父页面发送重置的信号,在B页面的 created() 方法中给父页面发送赋值的信号,但是值并没有达到我想要的样子。

经过测试A页面的 beforeDestroy()  方法是在B页面的 created() 方法之后执行的,所以B页面传过去的值修改成功之后又被A页面的数据重置了。

简单的写两个页面测试一下之后发现,实际的执行顺序是:

B.created()
 
B.beforeMount()
 
A.beforeDestroy()
 
A.destroyed()
 
B.mounted()

  

原文地址:https://www.cnblogs.com/alantao/p/12732775.html