问题描述：

当我们在编写动态路由时，常常会遇到第一次进入页面时可以正常展示，但是一旦刷新页面就会空白不显示的问题。

出现这种现象的问题是因为当页面刷新时，vuex数据丢失，不管是store中储存的数据亦或是动态添加路由的步骤都会丢失。

router.addRoute(root)

因此要解决这个问题，我们必须在刷新页面之后重新执行动态添加路由这一步骤。

解决方案：

在router/index.js中导入store，然后通过commit执行store中的activeRouter方法，进行重新动态添加路由的操作。

import store from '../store'

store.commit('activeRouter')

const mutations = {
    activeRouter(state) {
        router.addRoute(root)
    }