vuex改变了state值，但是组件computed里面没有及时更新，如何解决？

Question

import * as types from '@/store/mutation-types'
import axios from 'axios'
import qs from 'qs'

export default {
    state:{
      contacts:[]
    },
    mutations:{
        // 获取所有联系人信息
        [types.GET_ALL_CONTACT_LIST](state){
            axios.get('http://localhost:8089/contacts')
                .then((res)=>{                
                    res.data.map((contact,index)=>{
                        contact.index = index+1;
                        contact.fullName = contact.first_name+contact.last_name
                    })
                    console.log(res.data);
                    state.contacts = res.data;
                })
                .catch((err)=>{
                    console.log(`msg:${err}`)
                })
        }
    },
    actions:{
        getContacts(context){
            context.commit(types.GET_ALL_CONTACT_LIST);
        }
    }
  };

  computed:{
    ...mapState({
        contacts:state=>state.ContactList.contacts //这里没有及时更新
    })
  },

Answer 1

应该是因为没有配置getter的原因吧。参考文档：https://vuex.vuejs.org/zh-cn/...

// vuex 设置
getters: {
    contacts: state => state.contacts
}

// 组件内设置
computed:{
    ... mapGetters({
        'contacts'
    })
},

Answer 2

在actions里异步，在mutations里改变