微信小程序侧边栏导航需用scroll-view并设height:100vh、禁用transform、启用enhanced="true"，监听scrolltolower而非onReachBottom，scroll-into-view须用合法id并配合$nextTick，联动高亮应基于scrollTop与boundingClientRect计算。
微信小程序侧边栏导航在 uni-app 中不能直接用 swiper 模拟滚动
uni-app 编译到微信小程序时，scroll-view 在左侧固定区域中若设置 scroll-y，常出现滚动卡顿、手势冲突或无法触发 scrolltolower。根本原因是微信小程序原生渲染层对嵌套滚动容器的限制，尤其当父容器有 transform 或 position: fixed 时，子级 scroll-view 的 touch 事件可能被截断。
实操建议：
- 侧边栏容器必须使用
scroll-view，且显式设置style="height: 100vh;"（不能依赖 flex 布局撑高） - 禁用父级任何
transform、will-change或overflow: hidden - 给
scroll-view添加enhanced="true"（仅微信平台有效，启用原生滚动增强） - 分类项
view需设固定高度（如height: 80rpx），避免动态计算导致滚动锚点偏移
onReachBottom 在侧边栏里无效？那是你没监听 scrolltolower
开发者常误以为页面级的 onReachBottom 能捕获侧边栏滚动到底部，但该生命周期只响应页面整体滚动，和局部 scroll-view 无关。侧边栏加载更多或高亮联动必须靠 scrolltolower 事件。
实操建议：
- 在
scroll-view标签上绑定@scrolltolower="handleLower"，不要写成@reachbottom - 确保
scroll-view内容高度 > 容器高度，否则事件永不触发（可用v-if="list.length"配合:style="{ height: list.length * 80 + 'rpx' }"动态撑高） - 微信小程序中，
scrolltolower可能因快速滚动被节流，建议加防抖：用setTimeout延迟 100ms 执行逻辑
点击分类跳转右侧区域，scroll-into-view 失效的三个原因
常见现象：点击左侧菜单项，右侧商品区对应区块没自动滚动到视口顶部。问题多出在 scroll-into-view 的 target 命名、渲染时机或平台差异。
实操建议：
- target 必须是
id，且只能是纯字母数字（如id="cate-1"），不能含横线以外符号（cate_1可以，cate-1-2微信会忽略） - 右侧区块需在 DOM 渲染完成后再触发滚动，用
$nextTick(() => { this.scrollTop = 'cate-1'; })，而非直接赋值 - 微信小程序中，
scroll-into-view对position: sticky元素无效，右侧区域必须用普通view+scroll-view包裹
左右联动高亮：别用 ref 查 DOM，用 scrollTop + getBoundingClientRect
想让左侧菜单随右侧滚动自动高亮当前分类？用 ref 获取每个分类 DOM 再比对位置，在微信小程序中极易因渲染延迟导致错位。更稳定的方式是监听右侧 scroll-view 的 scroll 事件，结合 scrollTop 和各区块实际 top 值判断。
实操建议：
- 在右侧
scroll-view上绑定@scroll="onScroll"，取e.detail.scrollTop - 用
this.$nextTick确保所有右侧区块已渲染，再调用uni.createSelectorQuery()查询每个id元素的boundingClientRect - 遍历结果，找到
top 且 <code>top + height > scrollTop + 100的区块，更新左侧activeIndex - 注意：微信小程序中
createSelectorQuery必须在组件 mounted 后调用，且不能在scroll回调里高频执行，建议加 50ms 节流
微信小程序侧边栏真正的难点不在布局，而在滚动事件链的时机控制——DOM 渲染、平台原生滚动、uni-app 生命周期三者不同步，任何一个环节没对齐，联动就断掉。
