在 uni-app 中，需在 pages.json 对应页面的 style 节点下配置 navigationStyle: "custom" 隐藏原生导航栏，"default" 显示默认导航栏；必须动态获取 statusBarHeight 适配顶部布局，不可硬编码或依赖 uni.hideNavigationBar。
uni-app 中如何用 navigationStyle 控制单页导航栏显隐
uni-app 默认所有页面都显示原生导航栏，想只让某个页面（比如启动页、登录页、全屏海报页）隐藏，其余保持默认，不能靠全局配置——得在对应页面的 pages.json 里单独配 navigationStyle。
关键点：这个配置只对当前页面生效，且必须写在该页面的 style 节点下，不是根级 style，也不是 subNVue 或 h5 独有配置。
-
navigationStyle: "custom"→ 完全隐藏原生导航栏，需自己用<view>模拟（注意顶部状态栏高度兼容） -
navigationStyle: "default"→ 显示系统默认导航栏（iOS 灰白、Android 蓝灰），无需额外处理 - 未声明该字段时，以
pages.json根级style为准；但一旦某页面显式写了，就以该页面为准
pages.json 中单页配置示例与常见错位
错误写法是把 navigationStyle 放到根 style 或写成字符串 "none"（uni-app 不认）；正确位置是具体页面路径下的 style 内。
{
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页",
"navigationStyle": "default" // ← 这里生效
}
},
{
"path": "pages/login/login",
"style": {
"navigationStyle": "custom" // ← 登录页隐藏导航栏
}
}
],
"style": {
"navigationStyle": "default" // ← 这个只影响未单独配置的页面
}
}
- 如果漏写
navigationBarTitleText且用了custom，页面顶部会空出状态栏高度但无内容，容易误以为“白屏” - H5 端设置
custom后，uni.getSystemInfoSync().statusBarHeight仍可取到值，但原生导航栏已不占位，需手动给容器加padding-top - App 端 iOS 使用
custom时，右滑返回手势可能失效，需配合uni.navigateBack()或自定义返回按钮
如何在 custom 页面安全处理状态栏高度
不同平台状态栏高度不一致（iOS 通常 44px，Android 多为 20–25px，全面屏机型还可能更高），硬编码 padding-top: 44px 必然出错。
- 务必用
uni.getSystemInfoSync().statusBarHeight动态获取，注意它返回的是 px 值（非 rpx） - 在
onLoad或onShow中读取并赋给 data，避免首次渲染时为 0 - 如果页面用到了
position: fixed的顶部元素，需额外加top: statusBarHeight + 'px'，不能只靠 padding - 微信小程序真机调试时，
statusBarHeight在某些低版本基础库中可能返回 0，建议加 fallback（如Math.max(res.statusBarHeight, 20)）
为什么 uni.hideNavigationBar 不适合这个场景
这个 API 是运行时控制，但只在 App 和微信小程序有效，H5 和支付宝小程序不支持；而且它是全局操作，调用后所有页面导航栏都会消失，无法做到“仅当前页隐藏”。
- 调用
uni.hideNavigationBar()后再跳转到其他页面，新页面依然无导航栏，除非手动uni.showNavigationBar() - 页面卸载（
onUnload）时忘记恢复，会导致后续页面异常 - 不如直接用
pages.json配置来得稳定、声明式、跨端一致
最稳妥的方式始终是：需要隐藏的页面，在 pages.json 里明确写 "navigationStyle": "custom"，然后在页面内用动态状态栏高度做布局适配——别绕路，也别依赖运行时 API。
