全球vuex观察者

Question

我有一个Vuex商店在一个有点大的网络应用程序中提供许多Vue组件。我希望能够观察Vuex状态或吸气剂用于记录目的。但是，我希望能够“全局”地观看它们，即不依赖于任何特定的Vue组件。这排除了类似的技巧

//aComponent.vue
watch:{ '$store.state.data'(value, oldValue) { /*do something here*/ }}

和

//App.vue
created() {
  this.$store.watch((state) => state.watchedState) => {/*do something here*/ })
}

相反，我正在寻找一种直接从定义存储的模块观察我的Vuex状态或getter的方法，这样每当状态改变时，我都可以调用一个函数将它作为参数传递给旧状态和新状态，所以将更改写入数据库（理想情况下，更改本身将自动检测，如在Vue的watch(new,old) {...}中。

我想我应该为此目的使用Vuex本地方法store.watch()。但到目前为止，我无法根据需要从商店模块调用它。

任何线索？或者我错过了什么，我想要做的事情就是用不同的技术做得有效？

Answer 1

对于观察突变，你有这个选择。

您可以将subscribe发送到商店并在发生后通过突变获得通知。

store.subscribe（（mutation，state）=> {}）

您可以通过以下几种方式实现此目的：

1. 在您手工创建的商店中使用subscribe，最有可能在main.js
2. 创建一个插件，它附加到商店的每个实例，并再次subscribe
3. 只需使用vuex官方plugin进行记录

对于观看吸气剂，您可能需要手动修补getters属性。

再说一次，如果你想观察vuex在开发过程中会发生什么，你可以使用vuejs tools