Vue.js 使用vue、vue路由器制作具有“保持活动”功能的仪表板的最佳方法是什么？

我正在使用vue2，vue路由器和keep alive来开发仪表板。我希望达到以下目标：

登录->注销->登录其他帐户时应重新获取页面 （使用BeforeRouterner、beforeRouterLeave重新获取！？或使用condition保持组件的活动状态！？）

但vue路由器不能使用vue数据检查页面是否应保持活动状态

在HTML模板中，它将呈现和呈现。如果某些vuex数据直接以HTML显示，则会出现以下错误：尚未在对象中显示对象：

用户：{ 计划：{ xxx:' } }

当然，我可以为vuex数据提供所有属性初始化数据。它可以避免这种情况发生，但如果页面保持活动状态，它仍然会发生

此外，我可以在模板中写入许多v-if，但我认为在模板周围放置v-if以确保数据存在不是一个好主意..例如： v-if=“user.plan&&user.plan.xxx” 或者在组件根模板中添加v-if，这是个好主意吗

使用beforeMount而不保持活动状态，这没有问题，但它不是一个良好的用户体验仪表板（当您更改页面时，数据消失，或者您已经加载页面数据，但再次加载）

---

是否有人真正使用Vue 2及其相关库（vuex、Vue路由器）进行开发，请告诉我您是如何开发SPA项目的

vue路由器不能使用vuex数据，但组件可以。不要使用导航卫士，而是让登录按钮调用一个操作，当API调用成功时，调用路由器转到另一个路由（您可以在操作中导入路由器实例）。这就是我现在所做的！我认为水疗网站不会有问题，但如果它是一个有点复杂的水疗仪表盘系统，那就是我面临的问题。。我还使用类似appReady的变量来路由视图，以确保我的页面具有vuex。但正如我所说，还有一些问题。顺便说一句，如果没有生存，一切都会成功。但是我想要生存@@如果我理解正确，那么注销操作如下：按按钮=>转到登录屏幕=>使用beforeRouteEnter删除数据。您正在使用另一个防护来登录。我建议您执行以下操作：在获取数据时，按下按钮=>CallAction=>action调用mutation，然后调用router.push（）。