利用vuex解决keep-alive缓存后点击左侧菜单进行初始化，点击tab也缓存数据问题

项目中遇到这样一个需求，需要tab切换，对数据进行缓存，这个时候，我们会想到vue自带的keep-alive进行缓存；但是此时，点击左侧菜单，界面依然是上一次缓存的数据，这就不满足需求了。下面讲解下如果利用vuex来解决这个问题。

 

首先创建一个vuex的数据js文件

export default {
    namespaced: true,
    state: {
        // 页面缓存后初始化标记
        refreshPage: false // 标记是否初始化
    },
    mutations: {
        /**
              * @description 设置是否初始化
              * @param {Object} state state
              * @param {Object} log data
              */
        setRefreshPage (state, flag) {
            state.refreshPage = flag
        }
    }
}

1、在左侧菜单点击方法模块，增加如下代码

import { mapMuta