VUE-cli全局变量,路由跳转引起计算属性函数的执行

来源:互联网 发布:myeclipse编译java文件 编辑:程序博客网 时间:2024/06/18 16:59

定义全局变量
这里写图片描述
路由跳转的时候改变全局变量的值
这里写图片描述
在app.vue文件中的正确使用这种方式不存在以下那些问题,每次路由跳转都会触发2次;不管是否进入过路由或者刷新页面;
这里写图片描述

下面2种方式都是错误的使用方式,这2种方式的progressFlag2,progressFlag1的值都不会随全局变量global的值改变而改变;
(1)data属性
这里写图片描述
(2)计算属性
这里写图片描述

计算属性跟全局变量值VUE的监测情况实测
这里写图片描述
这里写图片描述
这里写图片描述
事实证明:
(1)路由的router.beforeEach跟router.afterEach的每次都会触发,都会console.log各自的内容
(2)路由钩子中的 store.commit(‘increment’)每次都会触发store中的mutations.increment执行,state值每次进入路由都会引起2次state的改变;
(3)但是计算属性progressFlag的值不是每次都会执行,只有在第一次进入新路由时,才会被执行2次;如果进入过了,则由router.beforeEach引起的state改变并不能引起计算属性函数的执行;router.afterEach引起的才会引起计算属性的执行;

原创粉丝点击