uni-app侧边栏吸顶不能直接用position: sticky，因scroll-view是独立滚动容器且多端兼容性差；必须通过监听@scroll、动态控制fixed定位及top值实现，核心是仅让分类标题栏吸顶并精准计算临界点。
uni-app 侧边栏吸顶为什么不能直接用 position: sticky
因为 scroll-view 是独立滚动容器，内部元素不响应父级 sticky 定位；而页面原生滚动下，sticky 在 iOS 小程序和部分安卓真机上兼容性极差，经常失效或触发回弹。真正能稳定吸顶的，只有靠监听 @scroll + 动态控制 top 值 + fixed 定位组合。
左侧分类菜单如何做到「滚动吸顶 + 右侧联动」
核心不是让整个侧边栏吸顶，而是只让「分类标题栏」（比如“手机”“电脑”“配件”这些一级类目）吸在顶部，下面的二级列表正常滚动。否则整个侧边栏固定会导致内容被遮挡、高度计算混乱。
- 侧边栏结构必须分两层：
<view class="category-header"></view>（吸顶部分） +<scroll-view class="category-list"></scroll-view>（可滚动内容） -
category-header用position: fixed，并通过:style="{ top: isSticky ? statusBarHeight + tabBarHeight + 'px' : '0' }"控制显隐 - 是否吸顶的判断逻辑：监听
category-list的@scroll，当detail.scrollTop >= 临界值（通常是 header 高度）时设isSticky = true - 临界值不能写死，要用
uni.createSelectorQuery().select('.category-header').boundingClientRect()在onReady中获取并缓存
右侧商品列表滚动时，左侧高亮怎么同步准确
常见错误是每次 @scroll 都重新查所有区块 offsetTop，导致卡顿、高亮错位。iOS 真机上尤其明显，因为节点渲染延迟或 scroll-view 滚动节流机制不同。
- 首次进入时，在
onReady里用setTimeout(() => { this.cacheSectionOffsets() }, 150)缓存每个分类区块的offsetTop，避免 DOM 未就绪 - 缓存结构推荐：
this.sectionOffsets = [120, 480, 920, ...]，不要存 selector 对象 - 滚动监听中，只做一次遍历：
const index = this.sectionOffsets.findIndex(top => scrollTop >= top)，取最后一个满足条件的索引 - 高亮状态用
:class="{ active: activeIndex === i }"控制，activeIndex由上述逻辑更新，不要用v-model绑定
安卓/iOS 真机上侧边栏滚动卡顿或穿透怎么办
根本原因不是性能差，而是样式和容器约束没对齐。尤其 iOS 下，scroll-view 内部 touch 事件被父层截断，或者滚动容器高度塌陷。
-
scroll-view必须显式设置height，例如：height: calc(100vh - 120px)（减去 status bar + tab bar + header 高度） - 父容器禁止
overflow: hidden，否则 iOS 会丢 touchstart 事件 - 侧边栏内容必须包裹在
<view class="drawer-content"></view>内，这是uni-drawer的硬性要求，否则层级错乱 - 如果用了
uni-drawer，show属性别绑定v-model，改用:visible.sync或单独 data 变量控制 - 安卓真机上，若侧边栏内含
scroll-view，务必加enable-back-to-top="false"，否则下拉触发页面回顶
吸顶的关键不在“固定”，而在“时机精准”——临界点计算不准、DOM 缓存过早或过晚、滚动事件监听粒度太粗，都会让吸顶看起来“抖”或“迟钝”。真机调试时，优先看 console.log 输出的 scrollTop 和 offsetTop 数值是否合理，比调样式更有效。
