uni-app自定义导航栏（navigationStyle: "custom"）独立渲染于页面最顶层，与侧边栏滚动容器隔离，不响应其transform变化，本质是状态不同步而非代码错误；需通过isDrawerOpen等数据驱动导航栏显隐、位移或样式变更实现视觉联动。
侧边栏滑出时导航栏不跟随，本质是两者滚动容器隔离、事件未透传、样式层级或状态不同步——不是“没写对”，而是默认就不联动。
为什么原生导航栏不会随侧边栏滑出而移动
uni-app 的自定义导航栏（navigationStyle: "custom"）渲染在页面最顶层，独立于内容区 DOM；而侧边栏通常是 view 或 scroll-view 构建的浮动层，z-index 再高也**无法推动导航栏位移**。常见误操作是给导航栏加 transform: translateX() 试图“跟着动”，但这样会破坏其吸顶行为，且 iOS 下易触发重绘卡顿。
- 导航栏由
uni-app渲染层统一管理，不响应子组件的 transform 变化 - 侧边栏滑出本质是局部 DOM 位移，不触发
onPageScroll或scroll事件，导航栏无感知 - 若用
uni-drawer，它默认不接管导航栏状态，需手动同步显隐逻辑
真正可行的“跟随”是视觉模拟 + 状态同步
所谓“跟随”，实际是让导航栏在侧边栏展开时**主动隐藏/偏移/变色**，收起时还原——靠的是控制导航栏自身状态，而非被侧边栏拖动。
- 在 data 中声明
isDrawerOpen: false，绑定到侧边栏组件的show或v-if - 导航栏区域用
v-show="!isDrawerOpen"控制显隐（避免重渲染），或用:class="{ 'nav-shifted': isDrawerOpen }"配合 CSSleft: 280rpx模拟位移 - 若导航栏含返回按钮，点击时需先收起侧边栏：
@click="isDrawerOpen = false; uni.navigateBack()" - H5 端注意：
touchmove必须加e.preventDefault()，否则页面滚动会干扰侧边栏手势，导致状态不同步
uni-drawer 场景下必须手动同步导航栏状态
很多人以为 uni-drawer 会自动联动导航栏，但它只管抽屉本身。一旦你用 mode="left"，导航栏仍静止在原位，形成“抽屉从底下钻出来”的割裂感。
- 监听
uni-drawer的@change事件，参数detail.show即当前开闭状态 - 不要只靠 ref 调
open()/close()，必须同步更新 data 中的isDrawerOpen - App 端真机测试时，若导航栏状态不更新，检查
vue.config.js是否误删了optimization.splitChunks，否则uni-drawer的事件回调可能未加载 - iOS 边缘滑动失效？不是导航栏问题，而是
touchstart在状态栏下方 20px 区域被系统拦截，建议将侧边栏触发区下移 30rpx，避开敏感区
吸顶导航栏 + 侧边栏共存时的边界细节
最易被忽略的是滚动锁定和 z-index 冲突。当侧边栏滑出，用户继续上拉页面，若导航栏仍在吸顶，会盖住侧边栏顶部；若取消吸顶，又失去导航功能。
- 推荐方案：侧边栏展开时，用
position: fixed+top: 0将导航栏“钉死”在顶部，同时设z-index: 999；侧边栏设z-index: 1000，确保压住导航栏右侧 - 不要依赖
plus.navigator.setOption动态改导航栏样式，该 API 在微信小程序不可用，跨端不一致 - 侧边栏收起动画结束前，禁止触发页面滚动（如
scroll-view的@scroll），否则导航栏可能在半途跳回原位——加一个isAnimating标志位控制
侧边栏和导航栏的“联动”从来不是物理拖拽，而是状态映射。关键不在怎么让导航栏动起来，而在什么时候让它看起来“应该动”。所有平台差异、手势截断、iOS 边缘失效，最终都归结为一点：isDrawerOpen 这个布尔值是否被所有相关方实时、可靠地读取到。
