vue router缓存,导致页面多次请求接口

本文探讨了在Vue.js应用中使用keep-alive组件进行页面缓存时,如何在切换特定路由时刷新页面并避免多次请求接口。提到了五种解决方案,包括通过include/exclude设置缓存组件,监听$router变化,利用activated/deactivated生命周期钩子精细化操作,以及处理相同组件在不同路由的情况。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

问在keep-alive中的在跳转到指定的路由时刷新对应的路由,其余不刷新。

<transition name="fade" mode="out-in">
   <keep-alive>
       <router-view></router-view>
   </keep-alive>
</transition>

有几种解决方式:

1.在keep-alive中直接添加 include,cachedViews(Array类型:包含vue文件的组件name都将被缓存起来);反之exclude则是不包含;

ps:所有.vue组件文件都必须附上name属性!!!建议用vuex管理cachedViews

<keep-alive :include="cachedViews">
      <router-view></router-</
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值