vue-cli使用vuex

一.npm下载

npm install vuex

二.创建store/index.js

三.store/index.jsy引入代码

import Vue from "vue"
import Vuex from "vuex"
Vue.use(Vuex);
export default new Vuex.Store({
    state:{
        yourName: "name",
        currDbSource: {},
        currJobData: {},
        DbSource: []
    },
    mutations:{
        // 保存当前菜单栏的路径
        savePath(state,yourName){
            state.pathName = yourName;
        },
        // 点击修改数据
        saveCurrDbSource(state,currDbSource){
            state.currDbSource = currDbSource;
        },
        // 保存当前点击的元数据
        saveCurrJobData(state,currJobData){
            state.currJobData = currJobData;
        },
        // 保存所有数据源
        saveDbSource(state,DbSource){
            state.DbSource = DbSource;
        }
    }
})

四.页面引用

export default {
  name: 'Home',
  components: {
    HomeHeader
  },
  data () {
    return {
      name: 'lane'
    }
  },
  created() {
    this.change()
  },
  methods: {
    change(){
      //获取state数据
      console.log(this.$store.state.youraName)
      //调用savePath方法修改state的数据
      this.$store.commit('savePath',this.name)
    }
  }
}