Vuex 小tip

最新推荐文章于 2025-09-13 21:59:18 发布

转载最新推荐文章于 2025-09-13 21:59:18 发布 · 76 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://segmentfault.com/a/1190000012915761

文章标签：

#json

vuex基本使用和相关规范

dispatch提交action,commit提交mutation。dispatch是异步，commit 是同步
通过使用,import和mapActions 可以获取action的方法并且能够直接调用或重命名调用
只允许通过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')
        })
    }