javascript - vuex异步更新问题

问题描述

问 题

 this.$store.dispatch('analyzesDetail', id).then(() => {
                        this.temp = this.$store.state.nlp.analyzesDetail.content;
                        //...
                    });

我在analyzesDetail这个action完成以后取获得state里面的analyzesDetail,为什么还是之前的数据?

action

analyzesDetail({commit}, id){
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            request(
                {
                    method: 'get',
                    url: `/agent/nlp/analyze/${id}`,
                },
                {type: nlpTYPE.ANALYZES_DETAIL},
                {type: nlpTYPE.ANALYZES_DETAIL_ERROR, message: '获取分析详细失败'},
                commit);
            resolve()
        }, 100)
    })
},

const mutations = {
[nlpTYPE.SEGMENT] (state, payload) {
    state.segment = payload;
},
[nlpTYPE.ANALYZE] (state, payload) {
    state.analyze = payload;
},
[nlpTYPE.CURRENT_ANALYZE] (state, payload) {
    state.currentAnalyze = payload;
},
[nlpTYPE.ANALYZES] (state, payload) {
    state.analyzes = payload;
},
[nlpTYPE.ANALYZES_ID] (state, payload) {
    state.analyzesId = payload;
},
[nlpTYPE.ANALYZES_DETAIL] (state, payload) {
    state.analyzesDetail = payload;
},

};

解决方案

用watch解决了这个问题,用watch监听analyzesDetail,发生变化之后再去计算我要的数据;但是感觉这只是临时解决了,到底为什么promise不行还是能弄清楚

这篇关于javascript - vuex异步更新问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！