keep-alive缓存三级及三级以上路由

需求需要缓存这个出入记录,当tab切换时不重新加载,当刷新页面时,或把这个关闭在重新打开时重新加载如图:

(我这里用的是芋道源码的前端框架)

keep-alive

1、include 包含页面组件name的这些组件页面,会被缓存起来

2、exclude 除了这些name以外的页面组件,会被缓存起来

3、没有include或者exclude属性,表示所有的路由组件都会被缓存起来

复制代码
<template>
  <section class="app-main">
    <transition name="fade-transform" mode="out-in">
      <keep-alive :include="cachedViews" exclude="redirect">
        <router-view :key="key" />
      </keep-alive>
    </transition>
  </section>
</template>

<script>
export default {
  name: 'AppMain',
  computed: {
    cachedViews() {
      return this.$store.state.tagsView.cachedViews
    },
    key() {
      return this.$route.path
    }
  }
}
</script>

解决方法

现在router里面的index.js里面把这三个路由写出来

然后在仓库里面手动把二级路由加上

这样就可以了

相关推荐
-Xie-2 天前
Mysql杂志(十六)——缓存池
数据库·mysql·缓存
七夜zippoe2 天前
缓存与数据库一致性实战手册:从故障修复到架构演进
数据库·缓存·架构
weixin_456904272 天前
跨域(CORS)和缓存中间件(Redis)深度解析
redis·缓存·中间件
MarkHard1233 天前
如何利用redis使用一个滑动窗口限流
数据库·redis·缓存
心想事成的幸运大王3 天前
Redis的过期策略
数据库·redis·缓存
wuyunhang1234563 天前
Redis---集群模式
数据库·redis·缓存
没有bug.的程序员3 天前
Redis 大 Key 与热 Key:生产环境的风险与解决方案
java·数据库·redis·缓存·热key·大key
wuyunhang1234563 天前
Redis----缓存策略和注意事项
redis·缓存·mybatis
零雲3 天前
除了缓存,我们还可以用redis做什么?
数据库·redis·缓存
梦中的天之酒壶3 天前
多级缓存架构
缓存·架构