退出登录后清除keepalive缓存

最近项目中被一个keep-alive的问题困扰了很久,项目中有四个页面使用了keep-alive,导致用户退出登录后,使用其他账号登录时,还保存着前一个用户的信息,经历了一系列的暴力删除无效后,最终采用了以下方法,用户退出登陆后移除keep-alive:

<keep-alive exclude="Footbar,Navbar" v-if="isLoggedIn">
      <router-view v-if="$route.meta.keepAlive"></router-view>
    </keep-alive>
<router-view v-if="!$route.meta.keepAlive||!isLoggedIn"></router-view>
data() {
    return {
      isLoggedIn: false,
    };
  },
 watch: {
    $route(to, from) {
      // if the route changes...
      let token = localStorage.getItem("token")||''
      if (token) {
        // firebase returns null if user logged out
        this.isLoggedIn = true;
      } else {
        this.isLoggedIn = false;
      }
    }
  }

参考了:

https://stackoverflow.com/questions/48661595/how-to-destroy-a-vuejs-component-that-is-being-cached-by-keep-alive
https://zhuanlan.zhihu.com/p/40374425

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容