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. 提交状态尽可能按照标准写法来提交，不要直接修改状态