vuex 属性state和mutations的使用方法

vuex 例子就是点击增加count的值递增加1和递增减1（按步骤安装和复制即可实现）

案例来自于https://www.bilibili.com/video/av25649895?from=search&seid=4818509662414366393这是一开始的基础写法如有兴趣可点击前往观看

1.npm安装：npm i vuex --save-dev

2.main.js中：

上面引入的store是在src文件夹下新建的store文件夹

import Vue from 'vue'
import App from './App'
import router from './router'
import Vuex from 'vuex'

Vue.use(Vuex)
Vue.config.productionTip = false

const store = new Vuex.Store({
  // 全局状态
  state: {
    count: 0
  },
  // 相当于计算属性，拿到state的值
  getters: {

  },
  // 简单的逻辑
  mutations: {
    increment (state) {
      state.count += 1
    },
    decrement (state) {
      state.count -= 2
    }
  },
  // 复杂的业务逻辑
  actions: {

  }
})

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '',
  store
})

3.在app.vue中