// components/app.vue <script> import {mapState, mapActions} from "vuex" export default{ methods: { ...mapActions({ resetStates: "resetStates" }) }, watch: { $route(to, from) { // 路由改变发起重置 this.resetStates(); } } } </script>
如果你的 chrome 浏览器安装了vuejs-devtools 在路由切换的时候就能够很清晰的看到上一个路由数据的的重置过程。
总结
实例点这里 。我们这里的 vuex 状态重置，是每次路由切换遍历所有的 store 中的状态，并把 initState() 中的属性重置，如果能做到把当前的路由对应的 state 重置就更好了，但是路由和 store 中的 module 并没有关联关系。这里只是提供一种重置 vuex 状态的一种方案，如果有更好方案还请各位看官留言。如有不妥的地方也欢迎拍砖留言。