Vuex 小tip

vuex基本使用和相關規範

1. dispatch提交action,commit提交mutation。dispatch是異步，commit 是同步
2. 經過使用,import和mapActions 能夠獲取action的方法而且可以直接調用或重命名調用
3. 只容許經過mutation 來變動state的狀態（內容）

官方Action介紹

action介紹

import {
        mapActions
    } from 'vuex'
    
    ...mapActions({
        getListsData: 'getListsData'
    })

使用的相關小技巧

• 能夠經過this.$store.state.這種方法取到state裏面的值並進行修改（不推薦）
• dispatch和commit的時候，第二個參數能夠帶一個載荷，這是一個json，且不容許有第三個參數
• 通常將數據請求寫在action中，若是對數據渲染有前後順序的要求，能夠將整個請求用promise return

getShopData({ commit }, resData) {
        return axios.post(url, resData).then((res) => {
            commit('getShopData', res)
            commit('displayPoints')
            commit('setShopScore', res.data.shopDetail.recommendScore)
            commit('getShopDetailIntro')
        })
    }

• 這種方法通常是和頁面直接引入action函數時連用

_this.getShopData().then()

建議

1. vuex雖然使用起來特別方便，可是對於小型項目，組件劃分不要太細
2. 提交狀態儘可能按照標準寫法來提交，不要直接修改狀態