scroll-into-view 无反应主因是目标节点未挂载或id不合法；右侧v-for未完成、id以数字开头、position/transform干扰均致静默失败；须用合法id、加position:relative、$nexttick延时、固定高度scroll-view。
scroll-into-view 为什么点了没反应？
根本不是 API 失效，而是目标节点还没挂载或 ID 不合法。常见静默失败场景：右侧 v-for 渲染未完成就触发 scroll-into-view；ID 以数字开头（如 id="1-food"）；目标元素被 position: absolute 或父级 transform 干扰导致 boundingClientRect 偏移。
实操建议：
- 所有锚点节点必须加
position: relative，避免被外层样式影响位置计算 - ID 只用字母、数字、下划线（如
category_drink），不用中文、空格、连字符 - 点击跳转时包一层
this.$nextTick(() => { this.targetId = 'category_drink' }) - 右侧
scroll-view必须设固定高度（如height: calc(100vh - 120px)）且开启scroll-y
右侧滚动时左侧高亮错位怎么办？
错位本质是滚动监听没节流 + 高度基准没对齐。直接比对 scrollTop 和预存 offsetTop 在不同机型、字体、padding 下必然漂移。
实操建议：
- 在
onReady后延时setTimeout(() => { queryAll() }, 100)获取所有锚点boundingClientRect().top，比单纯$nextTick更稳 - 判断高亮项时，用
scrollTop + window.innerHeight * 0.3作为“可视中心线”，而不是scrollTop === offsetTop - 监听
@scroll时加throttle(50)，iOS 下不节流会丢帧、误判 - 若页面有
uni-nav-bar或自定义顶部栏，从每个锚点top中减去其实际像素高度（如 88rpx ≈ 124px）
多级分类（比如“饮料 → 碳酸 → 可乐”）怎么联动定位？
一级分类用 scroll-into-view 跳转到大区块，二级/三级需在该区块内再滚动 —— 但 scroll-view 不支持嵌套滚动定位，必须手动算偏移。
实操建议：
- 一级锚点（如
category_drink）负责跳转到“饮料”大区顶部 - 二级锚点（如
subcat_cola）不设全局 ID，而是在“饮料”区块内用ref绑定，通过this.$refs.subcat_cola.$el.offsetTop获取相对偏移 - 跳转二级时：先等一级区块渲染完成（
$nextTick），再计算scroll-top = firstLevelTop + subOffset - 滚动监听高亮二级项时，只查当前展开的一级区块内的子节点，避免全量遍历拖慢性能
iOS 真机上滚动卡顿、联动延迟明显
不是代码逻辑问题，是 iOS scroll-view 默认启用 bounce 弹性回弹，每次滚动都触发 JS 回调，加上频繁的 createSelectorQuery 查询，主线程直接过载。
实操建议：
- 右侧
scroll-view加属性：bounce="false"、show-scrollbar="false" - 所有锚点高度提前缓存为数组（如
this.anchorHeights = [0, 420, 860, ...]），不再每次滚动都查 DOM - 左侧
scroll-view禁用scroll-y，只保留点击功能，彻底规避左右互相驱动抖动 - 别用
onPageScroll—— 它只响应页面级滚动，在scroll-view内部完全无效
多级联动最易被忽略的是「锚点层级隔离」：一级跳转后，二级定位必须基于当前已展开区块的局部坐标系，而非整个页面。否则在折叠/展开状态切换时，offsetTop 会突变，高亮和滚动立刻失准。
