时间戳

首页 > 解决方案 > 刷新 vue.js keep-alive 部分中的页面

vue.js - 刷新 vue.js keep-alive 部分中的页面

问题描述

我有一个使用 vue-router 的 Vue.js SPA。因为登录后每个页面都需要保持状态（如过滤器/分页输入）这是使用keep-alive完成的：

<keep-alive>
  <router-view/>
</keep-alive>

这很好用，但是当有人注销并再次登录时，由于保持活动状态，我仍然看到相同的过滤器值。

我可以在注销时以某种方式以编程方式刷新/清除保持活动状态的页面吗？

标签： vue.jsvue-router

解决方案

我认为没有一种简单的方法可以做到这一点（以编程方式），所以你有两个选择。

选项 1是重置状态，这意味着您在内部跟踪初始状态并监听诸如注销时发出的消息以将组件重置为其初始状态。

选项 2是使用以下内容简单地换出keep-alive组件：

<keep-alive v-if="loggedIn">
    <router-view></router-view>
</keep-alive>

<router-view v-else></router-view>

推荐阅读