1.组件实时监听state状态

//store文件
const serveList = {
    state: {
        detailInfo: {}
    },
    mutations: {
        setDetailInfo(state, info) {
            state.lawyerInfo = info;
        }
    },
    actions: {
        onDetailInfo: function (context, payload) {
            context.commit("setDetailInfo", payload);
        },

    },
    getters: {
        onDetailInfo(state) {
            return state.detailInfo
        }
    }
};
export default serveList;

下面是vue组件内监听

 //别忘了在上面引入 import {mapGetters} from "vuex";
 computed: {
            ...mapGetters([
                "onDetailInfo"
            ])
        },
 watch: {
      onDetailInfo: function (info) {  //info就是store里面的detailInfo最新值
         //业务逻辑
      }
  }

如果只是单纯把state里面的值实时赋给页面只需computed即可（该页面data里面千万别再次定义info）

computed: {
     ...mapGetters({
       info: "onDetailInfo",
     }),
   },

2.组件修改vuex里面的值

this.$store.dispatch('onDetailInfo', data) //data即你想传的值
this.$store.commit('setDetailInfo', data)
//推荐使用第一种

3.直接从vuex里面取值

this.$store.state.serveList.detailInfo
//如果modules没有多个的话只需去掉中间serveList即可