前言

这段时间在写weilan_M模板的时候考虑路由切换的时候缓存页面的同时保留滚动条原先的位置,刚开始尝试用routerscrollBehavior ,但是实现不了我的需求,也有可能是我用的不对吧,所以就采用了onBeforeRouteLeaveonActivated实现

正文

首先肯定要先在路由的meta里增加KeepAlive属性

在页面定义个变量来存储离开前页面的滚动距离,然后在onActivated生命周期里使用window.scrollTo滚动到指定的位置

const scrollY = ref(0)
onBeforeRouteLeave((to, from, next) => {
  scrollY.value = window.scrollY
  next()
})
onActivated(() => {
  window.scrollTo(0, scrollY.value)
})

如果有啥更好的更简单的方法请告诉我

最后修改:2023 年 09 月 20 日
如果觉得我的文章对你有用,请随意赞赏