天天看點

Vue官方文檔(48): vuex的基本使用

1.在package.json中增加vuex

"vuex": "^3.6.2"      

2.運作npm install

3.在src目錄下建立store目錄,在store目錄中建立檔案store.js

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

Vue.use(Vuex)

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment (state) {
      state.count++
    }
  }
})
export default store;      

4.在需要的頁面引入store,并使用

//路徑
import store from './store/store'      
store.commit('increment');
  alert(store.state.count);      

也可以在根執行個體中引入上述store. 修改main.js

1)

import store from './store/store'      
new Vue({
  render: h => h(App),
  router,
  store
}).$mount('#app')      
alert(this.$store.state.count);      

繼續閱讀