当我更改路由器时，如何将 vuex 状态或数据重置为默认值？答案

【问题标题】：When i change the router, how can i reset the vuex state or data as default?当我更改路由器时，如何将 vuex 状态或数据重置为默认值？
【发布时间】：2020-06-29 03:45:25
【问题描述】：

我不完全理解这个路由器和 vuex 状态……帮帮我！

实际上，如果我不使用 SPA，如果我移动菜单，它会自动重新加载。

但在 SPA 中，一切都保持不变。

事件虽然我移动到另一个 cmp，但它仍然存在。

我该怎么做？

1) 有没有办法重新加载页面？喜欢刷新

2) 或者当我更改路由器时如何设置默认 vuex 状态？

谢谢大家！

【问题讨论】：

状态的全部目的是在你的应用中保存数据。如果您不希望它持久化并且在初始化某个组件时想要一些默认数据集，只需在该组件的data 中提供它。如果您希望该数据设置当前状态的值，请在应该“默认”状态的组件的mounted() 中执行此操作。因此，每次您导航回渲染组件的路线时，状态都会重置。您可以在路线更改时重置它，但您很快会发现您想要重置某些路线更改而另一些不重置，因此安装选定的组件更容易。

标签： vue.js vuex vue-router

【解决方案1】：

要更改商店中的数据，您需要：

存储中的 getter（方法）
一个突变，这样你就可以改变你的商店状态

当你的路线改变时：-

this.$store.dispatch("storeName/getterName", dataYouWantToSend);

在 getters 对象下的内部存储，您可以编写：-

 getterName({ commit }, dataSentWhenRouterChanges) {
   commit("MUTATION_NAME", dataSentWhenRouterChanges);
 }

然后在类似以下的突变下改变突变状态：-

MUTATION_NAME(state, dataSentWhenRouterChanges) {
  state.yourStateYouWantToChange = dataSentWhenRouterChanges;
},

【讨论】：