store状态管理入门

vuex里的store状态理解
“store”基本上就是一个容器，它包含着你的应用中大部分的状态 (state)。
1.安装vuex
2.在src下新建一个文件夹store里的index.js
3.在main.js里引入store

import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store'

Vue.config.productionTip=false

/* eslint-disable no-new */

new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>'
})

4.在index.js里引入vuex,初始化store，再导出store

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

Vue.use(Vuex)

//初始化store
const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment (state) {
      state.count++
    }
  },
  actions:{
    increment(){
        this.$store.commit('increment')
        console.log(this.$store.state.count)
    }
}
})
store.commit('increment')

console.log(store.state.count) // -> 1
//导出store
export default new Vuex.Store()