watch监听vuex的值

昨天看到一个博客 watch监听无法监听到vuex的state的值 提了两种解决办法：

1.在store.js的state中使用Vue.observable（官方文档有具体说明）
2.在created初始化的时候将data中的属性赋值时指向整个state仓库 而不是赋值单个属性

于是乎 我今天想试试，但是！我的结果都是可以监听到，没有遇到那个问题 因为vuex的state本身就相当于一个响应仓库

1.首先我们新建store.js
1⃣️ 声明count和message两个变量
2⃣️ 在mutation写如下方法 addCount方法让每次加n; watchMessage 则每次将newVal赋值到新message属性之上

 
import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);
const state = ({
    count:11,
    message:'hello'
});

const mutations = {
  addCount(state,n){
     state.count+=n;
  },
  watchMessage(state,newval){
    state.message = newval;
  }
};
export default new Vuex.Store({
  state,
  mutations
});

1.首先在 computed中 将state中的变量接收 在模板中使用
2.开始在addNum中提交（commit）该方法，传数字99
3.最后watch监听$store.state.count的值 假如有新值的话我们在页面显示！
4.message同理也是该方法

最后看输出以及页面展示：大功告成！！！