1.插件使用vuex进行跨组件传值非常方便，但是当浏览器刷新时，state中写入的值会恢复到初始化状态，所以浏览器需要将值存储一个时间长了，我们可能会使用localStorage或者sessionStorage来存储，如果是这种情况，在项目中，除了使用vuex，localStorage等用于管理项目中需要跨组件传递的值以多种方式，这似乎有点令人困惑。这里，先说说利用vuex中的插件概念来实现新建一个src/store/plugin/saveLocal.js文件进行持久化存储：constsaveLocal=store=>{//当浏览器刷新时执行，即,当store初始化时//浏览器刷新时,第一次操作写在这里console.log('storeinitialization')//store.subscribe方法,只要有提交mutation的action在项目，这个方法会触发一次store.subscribe((mutation,state)=>{console.log('mutationsubmitted')})}exportdefaultsaveLocal在src/store/index.js中引入这个插件importVuefrom'vue'从'vuex'导入Vuex'从'./state'导入状态从'./getter'导入getter'从'./mutations'导入突变'从'./actions'导入用户从'./module/user'importsaveLocalfrom'./plugin/saveLocal'Vue.use(Vuex)exportdefaultnewVuex.Store({state,mutations,actions,getters,modules:{user},plugins:[saveLocal]})下面的方法可以将store中的所有值保存到localStorage中，每次刷新值时只需要从localStorage中取值就行了constsaveLocal=store=>{//浏览器刷新时执行，即store初始化时执行//浏览器刷新时，第一个操作写在这里console.log('storeinitialization')if(localStorage.store){store.replaceState(JSON.parse(localStorage.state))}//store.subscribe方法，只要项目中有提交mutation的动作，这个方法就会被触发一次store.subscribe((mutation,state)=>{console.log('mutationsubmitted')localStorage.state=JSON.stringify(state)})}exportdefaultsaveLocal如果你只想保持某个值不被刷新和改变，你可以这样做：添加src/store/state.js里面定义的menuType是永久保存的，可以在saveLocal.js中实现：constsaveLocal=store=>{if(localStorage.menuType){store.state.menuType=localStorage.menuType}store.subscribe((mutation,state)=>{localStorage.menuType=state.menuType})}exportdefaultsaveLocal值也可以存入sessionStorage:constsaveLocal=store=>{if(sessionStorage.menuType){store.state.menuType=sessionStorage.menuType}store.subscribe((mutation,state)=>{sessionStorage.menuType=state.menuType})}导出默认saveLocallocalStorage和sessionStorage只能保存字符串，所以如果需要保存对象或者数组，需要通过JSON.stringify将其转为字符串，获取时再通过JSON.parse转回
