在 vue 中如何监听 getters 中某个值的变化

Question

computed: {
    ...mapGetters([
      'token'
    ]),
  },
  watch: {
    token: function (val, oldVal) {
      console.log(val);
      console.log(oldVal);
    }
  },

如上面代码，我在 getters 定义了 token 这个值，我想去监听这个值的变化，在 watch 中这样写，却不管用，方法没有调用，请问是为什么？

Answer 1

用watch没错
建议检查下你的token是什么类型，如果是Object的话，它的属性改变，仅用上面的方法是监听不到的，需要深度watch，如：

watch: {
    // 深度 watcher
    c: {
      handler: function (val, oldVal) { /* ... */ },
      deep: true
    }
  }

如果不是Object类型的话，建议再检查下代码，或多贴点代码，这样比较容易定位问题。

Answer 2

用计算属性。

Answer 3

直接在computed里面监听

export default vue({
  computed: {
    token () {
      return 监听对象
    }
  }
})