Vue | 实现页面跳转刷新，在Vue页面中调用其他页面的方法

最近有一个登录界面的需求，感觉很简单，尝试各种方法每次都感觉快要成功了，但还是没能解决问题，果然没有系统学习就是很难立刻找到突破点，难以一语中的，好在历经千帆，在页面调用中就解决了这个问题。

需求描述：登录前，顶部导航栏不显示相应tabbar；登录后顶部导航栏显示tabbar。
问题所在：此Vue项目中顶部导航栏Navigate与内容是分开的组件，即界面直接并无关联。
解决需求：需要在展示页里调用顶部导航栏页里的方法，两者之间没有引用关系，根据vue的API发现可以用下面方法实现。
方法描述：实现页面跳转刷新，在Vue页面中调用其他页面的方法，很适合一些没有直接关系的页面之间的函数调用

1.新建一个Utils.js文件

import Vue from 'vue'
export default new Vue

2.在相关页面引入组件

在调用页与被调用页引入Utils.js文件，注意自己的文件路径即可

    // 引入公共组件
    import Utils from '../config/util';

3.调用页

// 调用方函数
functionA() {
    Utils.$emit('demo', 'msg');
}

4.被调用页

mounted() {
    var that = this;
    Utils.$on('demo', function (msg) {
        console.log(msg);
        that.functionB();
    })
},
methods: {
    functionB() {
        this.flag = this.$cookies.get('token')
    }
}

---

参考资料
[1]【Vue】在页面中调用其他页面的方法
[2] vue项目如何刷新当前页面
[3] vue项目中，定义并使用 全局变量，全局函数
[4] Vue如何获取当前页面的url,获取路由地址
[5] vue中使用localStorage存储信息