vue添加vuex，附简单使用流程

第一步

npm install vuex -S

第二步 建立vuex文件夹，建立store.js

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

const state = {
    num:1,
}
    
const mutations = {
    addNum(state,msg){
        state.num = msg++
    },
}

const actions = {

}

export default new Vuex.Store({
    state,
    mutations,
    actions
})

第三步 在mian.js引入

import store from './vuex/store'
new Vue({
  el: '#app',
  router,
  store,//在vue中引入使用
  components: { App },
  template: '<App/>'
})

第四步 使用

export default {
    name:'text',
    computed: {
        ...mapState(["num"]),//引入state的num字段
    },
    data() {
        return {
          a: 1,
        }
    },
    mounted() {
        this.addNum(a)//调用
        console.log(this.num)//查看结果
    },
    methods: {
        ...mapMutations(["addNum"]),//引入mutations内的方法
    },
}