全球vuex观察者

Question

我有一个Vuex商店，它在一个较大的Web应用程序中提供许多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状态或获取方法的方法，以便每当状态更改时，我都可以调用将其作为参数传递的函数，即旧状态和新状态状态，以便将更改写入数据库（理想情况下，更改本身会被自动检测，如Vue的watch(new,old) {...}中一样。

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

有任何线索吗？还是我错过了某些事情，而我想做的事却可以通过另一种技术来有效地完成？

Answer 1

要观看突变，您可以使用此选项。

您可以subscribe到商店，并在发生突变后得到通知。

  

store.subscribe（（突变，状态）=> {   }）

您可以通过以下两种方式实现这一目标：

1. 在您手动创建的商店中使用subscribe，最有可能在main.js

2. 创建一个插件，该插件将附加到商店的每个实例，然后再subscribe附加到商店

3. 只需使用vuex官方plugin进行登录

为观看吸气剂，您可能需要用手猴子修补getters属性。

然后，如果您想观看vuex在开发过程中发生的情况，可以使用vuejs tools