Question

如果我有一个如下所示的计算属性：

computed: {
  greeting() {
    const state = this.$store.state;
    if (state.name === 'Joe') {
      return 'Hey, Joe';
    } else {
      return 'Hello, ' + state.name;
    }
  }
}

Vue要设置观察者的对象是什么？ this.$store.state或state.name或两者兼而有之？问因为：

我想确保此Vue实例没有侦听对Vuex存储的任何和所有更改 - 这似乎会降低大型应用程序的性能。
我有业务要求通过道具设置一些计算属性，而我很难让它们被反应。
我只是好奇。

Answer 1

如果this.$store.state和this.$store.state.name属性是被动的（它们应该是），那么当这些属性的值发生变化时，Vue将观察这些属性的变化并重新评估greeting

不会观察到任何其他属性。

这将导致重新评估greeting：

this.$store.state.name = 'foo';
this.$store.state = bar();

这将不导致greeting被重新评估：

this.$store.state.foo = 'foo';
this.$store.state.a.b.c = 'bar';
this.$store.apple = 'pink lady';

Vue.js如何在计算属性中设置观察者？

1 个答案: