1. 程式人生 > >vue學習模組記錄一 (vuex-store)

vue學習模組記錄一 (vuex-store)

1:如何使用vuex-store    2018-10-26

   vuex是什麼呢,相當於react的redux,如果專案使用資料過多的話,直接管理是非常不方便的,那麼採用vuex,那些繁瑣的問題     就迎刃而解了,學習demo: https://www.cnblogs.com/liningstyle/p/8335129.html

modules:匯入模組管理

mutations:方法修改數值

commit('Count ')呼叫mutations的固定方法,引數為mutations的方法名,當然commit不止傳一個引數,也可以傳很多

actions:官方推薦 , 將非同步操作放在 action 中

context.commit('Count ')的意思是觸發mutations下的Count函式,那麼怎麼觸發actions的函式,

<a href="javascript:;" @click="$store.dispatch('Acount')">click</

 

 

dispatch方法是官方固定觸發actions下函式的方法

getters:getters 和 vue 中的 computed 類似 , 都是用來計算 state 然後生成新的資料 ( 狀態 ) 的。比如我們heade.js的state有一個值show:false   getters就是計算與false相反的,但是它計算的值是不能直接修改的, 需要對應的 state 發生變化才能修改。 

最後一點就是為了方便操作開發,一般情況$store.state.Heade.show,$store.state.show寫起來不是很方便,那麼vuex的輔助函式mapState、mapGetters、mapActions就可以解決這個問題,把stroe物件那個對映到this

import {mapState} from 'vuex';