vuex - 常用命令學習及用法整理
阿新 • • 發佈:2018-04-07
UNC 實例 tab justify 用法 變更 fun -c method
https://vuex.vuejs.org/zh-cn/api.html
命令 |
用途 |
備註 |
this.$store |
組件中訪問store實例 |
|
store.state.a |
獲取在state對象中的數據 |
store文件中 |
$store.state.a |
視圖上(即標簽上) |
|
this.$store.state.a |
1) 組件內部,data數據裏邊 2) 組件計算屬性返回值 computed: { count () { return this.$store.state.count } } |
|
store.getters |
派生state的一些狀態(即拿到,再進行一些小變化後返回新的狀態,比如給state中某個數組內部小於10的前邊加上0再返回) |
Getter對象 |
this.$store.getters.oneFunction |
訪問Getter對象內的某個屬性的值 |
在組件的計算屬性中使用 |
store.commit() |
【方法】提交 mutation,觸發狀態變更(修改state的值) |
action文件中 |
this.$store.commit(state,payload) |
在組件的 methods 中 |
|
store.dispatch() |
【方法】觸發 action,以間接地觸發mutation,進而使狀態變更(修改state的值) |
action文件中 |
this.$store.dispatch(‘incrementBy‘,amount) |
在組件的 methods 中 ‘incrementBy‘: mutationFunctionName amount = payload |
2018-04-07 18:00:52
vuex - 常用命令學習及用法整理