直接用 scroll-view + scroll-into-view 双向驱动即可稳定实现联动，无需监听页面滚动或手动计算 scrollTop；关键在于 ID 合法性、DOM 渲染时机、节流判断、固定高度及左右解耦控制。
直接用 scroll-view + scroll-into-view 双向驱动就能稳定跑通，不用监听页面级滚动、不手动算 scrolltop、也不依赖 onpagescroll —— 它在 scroll-view 内部根本收不到事件。
左侧点击跳转右侧，为什么 scroll-into-view 有时失效
90% 是目标 id 不合法或不在正确作用域内：
-
id必须全小写、只含字母/数字/下划线，比如cat-food可以，catFood或cat food会静默失败 - 目标元素必须是右侧
scroll-view的直系子节点（或至少能被其子树遍历到），不能跨嵌套层级 - DOM 必须已渲染，
click回调里要包一层this.$nextTick(() => { this.scrollInto = 'cat-food' }) - H5 端可用
document.querySelector('#cat-food')验证；小程序端用uni.createSelectorQuery().select('#cat-food').boundingClientRect()检查是否返回有效矩形
右侧滚动时左侧高亮不同步，常见卡顿原因
不是监听太慢，而是监听太频繁且计算方式不合理：
- 别在
@scroll里每帧都调getBoundingClientRect()—— 安卓低端机直接掉帧 - 改用节流：用
setTimeout或uni.$once把判断逻辑收敛到滚动「趋于停止」后 50ms 内执行 - 提前缓存所有分类区块的
offsetTop（用uni.createSelectorQuery()在onReady或数据加载后一次性获取），避免滚动中反复查 DOM - 判断逻辑用
scrollTop + 100 > item.offsetTop而非严格相等，加容错偏移防止临界点误判
左右都用 scroll-view，但高度必须固定
不设固定高度，scroll-y 会失效，联动彻底瘫痪：
- 左侧菜单
scroll-view必须设:style="{ height: scrollHeight + 'px' }"，不能靠内容撑开 - 右侧内容
scroll-view同样要固定高度，建议通过uni.getSystemInfoSync().windowHeight动态计算，减去顶部导航栏高度 - 禁用默认滚动条更干净：
show-scrollbar="false" - iOS 上慎用
scroll-top手动赋值——容易跳动或无响应，优先走scroll-into-view
最易被忽略的一点：左右两个 scroll-view 必须各自独立控制，不要试图用一个 data 字段同时绑定两边的滚动状态。左侧高亮靠 leftActiveIndex 控制 class，右侧定位靠 scroll-into-view 字符串 ID，二者解耦才稳。
