Vue后退不刷新，前进刷新问题

in 前端 with 0 comment

应用场景
列表页进入详情页，详情页后退至列表页不刷新页面；其它情况刷新列表页

简单来说，是一个前进刷新，后退不刷新的功能

实现方式

<keep-alive>
  <router-view :key="$route.fullPath" v-if="$route.meta.keepAlive"/>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"/>

首先列表页需要keepAlive,这样的话缓存了列表页。
接下来实现，非详情页打开列表页刷新功能，这个时候就 :key="$route.fullPath" 在其它可以打开这个页面的地方添加查询参数query.__t = + new Date() .这样就实现了刷新。

赞助一杯咖啡☕️

本文由 widdy 创作，采用 知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名
最后编辑时间为: Apr 28, 2021 at 11:33 am

← → ↓ ↑
Comments are closed.