Vue 3 或者 Svelte 中，从无限滚动列表页进入详情页，返回后如何滚动到之前的位置？

我最近一直在 Svelte 上尝试写手机端的 web app ，有这么几种方案：

1. 离开列表前，在 sessionStorage 里记录位置，返回时读取位置，滚动到之前保存的位置；

   这种方法有几个问题：首先，每次切换 view 时，之前的 view 实例被销毁，加载新的 view, 然后加载数据。这种情况下，从详情回到列表页，需要知道之前滚动到了第几页。

   而翻页又有起码两种实现方式，一种是往下滚动的时候不停地加载后面的页面，view 上保留着所有页面数据的内容；另一种是无论怎么滚动都只保留前一页、当前页和后一页的 3 页内容。如果用的是第一种方式，那么每次回到列表，都要加载完所有页面，然后再调用 window.scrollTo() 滚动到目标位置。试想想翻了 100 多页的情况，这显然不合理；如果用的是第二种方式，嗯… 实现起来会复杂很多，倒也不是不行。

2. 离开 view 之前不让 view 实例销毁，而是隐藏起来。这样回来之后，自然恢复到原来的状态，但是这种方式需要路由或者框架本身的支持。而且如果离开列表的目标不是去查看详情，而是修改数据，回来之后还得刷新被修改的数据，似乎也不好搞。

想请教一下大家平时都是怎么处理这个问题的？

或者，web app 的开发有其它替代方案来解决这种编辑之后回不到原来位置问题，而不是在这一种方案的实现上死磕？

答:返回还要重查数据不太合理吧？可以把已查出的列表数据存在全局状态管理里，返回时直接同步渲染出来并定位，用户应该察觉不到页面跳动。
至于状态同步，都用状态管理方案了本地全局状态自然就是和后端同步的。
答:vue3 中使用 keep-alive ，和配置 vue-router 的 scroll-behavior 达到效果

https://router.vuejs.org/zh/guide/advanced/scroll-behavior.html
答:前几年我在用 vue2 的时候，子路由容器是绝对定位在父级路由上层的，所以父级没有被销毁，不需要考虑记录位置的问题，还可以直接修改父级路由数据。