javascript - vuex asynchronous update problem

Question

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

After the analyzeDetail action is completed, I obtain the analyzeDetail in the state. Why is it still the previous data?

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;
},

};

Answer 1

Using watch to solve this problem, use watch to monitor analyzeDetail, and then calculate the data I want after the change; but I feel that this is only a temporary solution, I can still figure out why promise does not work

Answer 2

This in the arrow function is not a vue instance, so it will not be updated.