单页应用中应明确滚动主体（window或特定容器），在路由离开前用sessionStorage保存滚动位置，键名带路径标识；视图激活后需等待DOM渲染完成再恢复，注意类型转换、移动端兼容性及缓存清理。
在单页应用（SPA）中切换视图时，用 sessionStorage 保存并恢复滚动位置是常见需求。关键不是“存”，而是“什么时候存、什么时候取、存哪一层的滚动容器”。
明确滚动主体：是 window 还是某个容器？
多数 SPA 使用路由切换局部内容（如 <main> 或 <router-view>），此时页面整体 window 滚动可能不变，真正需要记忆的是内容区的滚动条。务必确认目标元素——可能是 document.documentElement、window，也可能是某个带 overflow-y: auto 的 div。
- 若整个页面上下滚动：用
window.scrollY或document.documentElement.scrollTop - 若只有某区块（如列表区域）可滚动：需通过
ref或querySelector获取该 DOM 元素，再读写其scrollTop
在路由离开前保存位置
利用路由守卫或组件生命周期钩子，在视图卸载前把当前滚动值存入 sessionStorage，键名建议带上路由路径或视图标识，避免冲突。
Ai Coach Batch Session Summary
下载
批量分析录音转写，输出多维度拓客报告。触发词：录音分析、总结、音频总结、拜访记录总结。当用户提及「分析录音」「看看录音数据」「最近的录音」「通话记录」且意图为批量统计/分析时触发。仅出现「录音」或「拜访」时需结合上下文，若仅查看单条详情则不触发。
- Vue Router：在
beforeRouteLeave或onBeforeUnmount中执行 - React Router v6+：用
useEffect清理函数，或封装自定义 hook 监听路由变化 - 纯 JS SPA：监听
popstate或在手动跳转前调用保存逻辑 - 示例键名：
scrollPos:/user/list、scrollPos:product-detail
在视图激活后恢复位置
恢复时机比保存更关键——必须等目标 DOM 渲染完成后再设置 scrollTop，否则元素还没挂载，赋值无效。
立即学习“Java免费学习笔记（深入）”；
- Vue：用
nextTick()包裹el.scrollTop = pos - React：用
useEffect并确保依赖项包含 DOM 引用，或用setTimeout(..., 0)延迟到微任务末尾 - 通用技巧：对容器元素使用
el.scrollTo({ top: pos, behavior: 'auto' })，避免动画干扰用户体验
注意边界与兼容性细节
sessionStorage 本身无问题，但实际落地常因细节翻车：
- 不要存
NaN或null：读取后做Number(pos) || 0安全转换 - 移动端 Safari 对
body.scrollTop支持不稳定，统一用document.documentElement.scrollTop - 如果页面有“回到顶部”按钮或锚点跳转，记得在触发时清空对应路径的缓存，避免下次进入误恢复
- 某些 UI 库（如 Element Plus）的虚拟滚动列表需单独处理，不能依赖容器 scrollTop
