vuex 基本使用

vuex:同一狀態（全局狀態）管理，簡單的理解，在SPA單頁面組件的開發中，在state中定義了一個數據之后，你可以在所在項目中的任何一個組件里進行獲取、修改，並且你的修改可以同步全局。

1，安裝 npm i vuex --save

2，在src文件目錄下新建store>index.js文件

import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const store = new Vuex.Store();
 
export default store;

3， 入口文件里面引入store，然后再全局注入

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

4，使用

4-0，在state中定義數據

4-1，Getter相當於vue中的computed計算屬性，getter 的返回值會根據它的依賴被緩存起來，且只有當它的依賴值發生了改變才會被重新計算，Getters 可以用於監聽、state中的值的變化，返回計算后的結果

4-2，給action注冊事件處理函數，當這個函數被觸發時候，將狀態提交到mutations中處理。actions里面自定義的函數接收一個context參數和要變化的形參

4-3，mutations是一個對象里。面的方法 都是同步事務，是更改state初始狀態的唯一合法方法，具體的用法就是給里面的方法傳入參數state或額外的參數

dispatch：含有異步操作，例如向后台提交數據，寫法： this.$store.dispatch('action方法名',值)

commit：同步操作，寫法：this.$store.commit('mutations方法名',值)