vuex 存储状态的利器

为什么要用vuex

1、在多层跨级组件之间传值，若是用父子组件，则非常麻烦。

2、在多个兄弟组件之间传值，使用vuex更好

注意：动态存储的，刷新页面，状态会消失。所以在session里保存一下

平常用到存数据和取数据。

取数据： this.$store.state.xxx

存数据：this.$store.commit('xxxx', xxxx)

新建store文件

import Vue from "vue"
import Vuex from "vuex"
Vue.use(Vuex);
export default new Vuex.Store({
  state:{
    pathName: "",
    currDbSource: {},   
  },
  mutations:{
    // 保存当前菜单栏的路径
    savePath(state,pathName){
      state.pathName = pathName;
      sessionStorage.setItem('pathName',pathName)
    },
    // 保存当前点击的数据源
    saveCurrDbSource(state,currDbSource){
      state.currDbSource = currDbSource;
      sessionStorage.setItem('pathName',pathName)
    },
  }
})

在main.js中引入

import store from ''//store文件相对位置
var Vueapp = new Vue({

el:'#app',
store,
})