vue3使用keep-alive处理返回scrollTop

1、使用keep-alive进行缓存

<Suspense>
      <div>
        <router-view v-slot="{ Component }">
          <keep-alive>
            <component :is="Component" v-if="$route.meta.keepAlive"/>
          </keep-alive>
          <component :is="Component" v-if="!$route.meta.keepAlive"/>
        </router-view>
      </div>
    </Suspense>

页面激活的时候会触发onActivated;
如果存在多级的router-view,需要在每一级写上上面的缓存代码。

2、路由的scrollBehavior

 scrollBehavior: (to, from, savedPosition) => {
    if (savedPosition) return savedPosition;
    return { left: 0, top: 0 };
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容