uni-drawer是官方轻量抽屉组件，需手动实现筛选联动滚动、状态同步与持久化；注意ios滚动穿透、scroll-view高度设置及防抖容差优化。
uni-app 侧边栏筛选怎么用 uni-drawer 实现基础交互
直接上结论：别自己手写抽屉动画，uni-drawer 是 uni-app 官方维护的轻量组件，开箱即用，但默认不支持「筛选项联动滚动 + 左右双向联动」这种京东式行为，得手动补逻辑。
常见错误是把 uni-drawer 当成纯展示容器，一打开就卡死——它本身不管理内部列表滚动、选中状态、或与主内容区的高亮同步。这些都得你控制。
-
show控制显隐，但别绑定在v-model上做双向，容易和内部toggle冲突；建议用:visible.sync或单独的data变量 - 侧边栏内容必须包裹在
<view class="drawer-content"></view>里，否则 iOS 下可能出现滚动穿透或层级错乱 - 安卓真机上，如果侧边栏内有
scroll-view，需加enable-back-to-top="false"，否则下拉会触发页面回顶
如何让左侧分类菜单滚动时，右侧商品列表自动锚点定位
这不是 uni-drawer 自带能力，本质是「滚动监听 + 元素位置计算」。京东式体验的关键在于：左边点某个品类，右边立刻滚到对应区块；反过来，右边滚到某区块，左边高亮对应项。
难点不在实现，而在性能和边界判断：滚动频繁触发、节点未渲染完成、动态高度导致 offsetTop 计算不准。
- 用
uni.createSelectorQuery()获取右侧每个分类区块的offsetTop，缓存进数组，别每次滚动都查 - 监听右侧
scroll-view的@scroll事件，取detail.scrollTop，遍历缓存的 offset 数组找最近匹配项 - 左侧高亮用
:class="{ active: activeIndex === i }"控制，activeIndex由滚动逻辑更新 - 首次进入页面时，
onReady钩子中延迟setTimeout(() => { this.updateActiveIndex() }, 100)，确保 DOM 渲染完毕
uni-app 中 scroll-view 在侧边栏里为什么滚动不了或卡顿
这是高频问题，90% 出现在 iOS 真机或微信小程序开发者工具中。根本原因不是组件 bug，而是 scroll-view 的渲染限制和样式约束没满足。
典型现象：scroll-view 高度为 0、手指划不动、滚动后内容错位、快速滑动时闪退。
- 必须显式设置
height（不能靠flex: 1或100vh），推荐用calc(100vh - Xpx)减去 header 和 footer 高度 - 父容器不能有
overflow: hidden，否则 iOS 下会截断 touch 事件 - 避免在
scroll-view内使用v-for渲染大量 item，超过 50 条建议做虚拟滚动（uni-app 暂无原生支持，需用uni-recycle-list替代） - 开启
scroll-with-animation会让滚动变慢，调试阶段先关掉
左右联动筛选状态怎么持久化且不丢失
用户点了几项、展开哪些子类、搜索关键词——这些状态一旦页面刷新就清空，体验断层。uni-app 没有内置筛选状态管理，得自己设计轻量方案。
关键不是存哪，而是「什么时候存」和「什么时候读」：过早存会导致误存中间态，过晚读会导致白屏闪动。
- 用
uni.setStorageSync存，键名建议带页面路径前缀，比如"filter_home_category"，避免多页冲突 - 不在
onLoad里直接读，而是在onShow后nextTick再读取并赋值，确保 data 初始化完成 - 子分类展开状态不要全量存，只存「当前激活的一级分类 ID」和「该分类下已展开的二级 ID 数组」，结构扁平
- 如果用了 vuex / pinia，注意小程序端 store 是内存态，冷启动后依然为空，仍需搭配本地存储兜底
最易被忽略的是：左右联动滚动的「防抖阈值」和「偏移容差」。设太小，滚动轻微抖动就反复切换高亮；设太大，用户明明已经滚过临界点却没响应。实测 50px 偏移 + 80ms 防抖比较稳，但具体得看你的区块高度分布。
