1、使用步驟
1.1 使用 npm 安裝 Vuex 安裝命令 cnpm install vuex -S
1.2 .src目錄下創(chuàng)建一個store的文件夾，里面放一個index.js
1.3 實例化vuex實例對象
2.vuex的核心概念五個
1 、state
組建中訪問state中數(shù)據(jù)的第一種方式
this.$store.state.全局數(shù)據(jù)名稱
2 組件中訪問state的第二種方法
1.從vuex中按需引入組件
import { mapState } from 'vuex'
2.將全局數(shù)據(jù)，映射為當前組件的計算屬性
computed:{
//在頁面中 通過插值表達式顯示
...mapState([ 'count' ])
}
2.mutation（突變） 唯一能夠改變state中數(shù)據(jù)的東西使用
1.this$store.commit();
方法如下：一般在methods中使用
image.png
mutation按需引入同state
import { mapState, mapMutation } from 'vuex'
2.將全局數(shù)據(jù)，映射為當前組件的計算屬性
mothods:{
...mapMutation(['add','addn']),
//在方法中調(diào)用
btn(){
this.add();
}
}
3、action 異步操作只能用action（引入方式同上）
在action中不能直接修改state中的數(shù)據(jù)，需要調(diào)用context.commit（）,觸發(fā)mutation 的方法
image.png
4.getter類似computed，使用如下
image.png
image.png
核心內(nèi)容的引入如圖：
image.png
5.module
將 store 分割成模塊（module）。每個模塊擁有自己的 state、mutation、action、getter、甚至是嵌套子模塊
具體參考：vuex：https://vuex.vuejs.org/zh/guide/modules.html
