history.scrollrestoration = 'manual' 用于禁用浏览器在前进/后退和刷新时自动恢复滚动位置，默认为'auto'；设为'manual'后需配合beforeunload和pageshow事件手动调用scrollto(0,0)确保置顶。
history.scrollRestoration = 'manual' 是什么作用
它告诉浏览器：别自动恢复上次的滚动位置，后续所有滚动行为都由 JS 显式控制。这个设置只影响「前进/后退」和「刷新」两类操作的默认滚动行为，不改变页面内正常滚动逻辑。history.scrollRestoration 默认是 'auto'，设为 'manual' 后，浏览器在 history 导航（比如 history.back()）或刷新时，不再尝试还原 window.scrollY，而是保持在顶部（0, 0）——但注意：这**不是强制置顶**，只是“取消自动恢复”，你仍需自己调用 window.scrollTo(0, 0) 才能确保真正在顶部。
为什么长列表页面刷新后不能只靠 scrollRestoration='manual'
因为 scrollRestoration = 'manual' 只是关掉了浏览器的自动恢复机制，并不等于“每次刷新都滚到顶部”。尤其在以下场景中，用户仍可能看到非预期的滚动位置：
- 页面首次加载后用户已向下滚动，然后手动刷新（F5 或地址栏回车）——此时若没额外干预，
scrollTo(0, 0)没被触发，页面会从上次记录的scrollY开始渲染（尽管scrollRestoration是 manual，但该值仅约束 history 导航，不约束刷新初始状态） - 某些 iOS Safari 版本对
beforeunload支持不稳定，导致刷新前没来得及执行scrollTo(0, 0) - 使用
location.reload()编程式刷新时，beforeunload不一定触发（尤其在无用户交互上下文中）
必须搭配 beforeunload + pageshow 才可靠
真正防住刷新后错位，得靠两个事件组合：
-
beforeunload：在页面卸载前立即置顶，视觉无跳动。用addEventListener('beforeunload', () => window.scrollTo(0, 0))，不要用onbeforeunload = ...（易被覆盖） -
pageshow：捕获浏览器缓存恢复场景（如 iOS 后退、Android 被系统回收后重建），当e.persisted === true时再执行一次window.scrollTo(0, 0) - 二者缺一不可：
beforeunload拦不住缓存页恢复，pageshow拦不住普通刷新
示例代码：
if ('scrollRestoration' in window.history) {
window.history.scrollRestoration = 'manual';
}
window.addEventListener('beforeunload', () => {
window.scrollTo(0, 0);
});
window.addEventListener('pageshow', (e) => {
if (e.persisted) {
window.scrollTo(0, 0);
}
});
虚拟列表场景下特别注意 body 溢出控制
如果你用的是 react-window 或 vue-virtual-scroller 这类虚拟滚动方案，常伴随 body { overflow: hidden } 或 overflow-y: hidden 的布局 hack。这种情况下，即使 scrollRestoration = 'manual'，刷新后浏览器仍可能把旧的 scrollY 值强行应用到一个“不可滚动”的 body 上，造成内容截断、顶部留白或底部消失等视觉异常。
- 务必确保
beforeunload中的scrollTo(0, 0)在 DOM 卸载前执行，而不是依赖DOMContentLoaded或load（它们太晚，用户能看到跳变） - 避免在
useEffect或mounted钩子中做置顶——那是在新页面渲染完成后才执行，必然有闪动 - 如果用了
position: fixed+top: 0的全屏容器，检查是否意外继承了父级transform或will-change，这些可能干扰滚动坐标计算
最稳的路径就一条：设 scrollRestoration = 'manual' + beforeunload 置顶 + pageshow 补漏。其他任何时机的 scrollTo 都只是妥协方案，容易在慢设备或特定 iOS 版本上露馅。
