唯一可靠方式是设 navigationstyle: "custom" 自己用 渲染，因 navigationbartitletext 仅支持字符串且底层调用原生 api，不解析 html 或组件，所有平台均不支持嵌入图片或富文本。
不能直接在原生导航栏中间加图片标题 —— 唯一可靠方式是设 navigationStyle: "custom"，自己用 <image></image> 渲染。
为什么 navigationBarTitleText 不支持图片
这个配置项只接受字符串，底层走的是各端原生 API（如微信小程序的 setNavigationBarTitle），不解析 HTML 或组件。传入 <image src="..."></image> 字符串只会原样显示为文字，不会渲染成图。
- 所有平台（微信/支付宝/APP/H5）均不支持在
navigationBarTitleText里嵌入图片或富文本 - 试图用 Unicode 图标、emoji 替代 logo 是可行的，但尺寸、对齐、颜色控制极弱，且 iOS/Android 渲染不一致
-
titleNView（App 端）允许加按钮和搜索框，但依然没有“中间插图”能力
用 navigationStyle: "custom" 手动实现图片标题
这是唯一能精准控制标题区域内容的方式，但需你完全接管状态栏适配、高度、平台差异。
- 在
pages.json对应页面 style 中设"navigationStyle": "custom" - 在页面
<template></template>顶部写一个自定义导航栏容器，例如：<view class="custom-nav"><view class="status-bar-placeholder"></view><view class="nav-content"><image class="logo-title" :src="logoUrl"></image></view></view>
- 用 CSS 处理状态栏：推荐
height: env(safe-area-inset-top)+padding-top: var(--status-bar-height)双保险，避免 iOS 被遮挡 - 图片宽高建议用
rpx或固定px（如40rpx高），避免拉伸；vertical-align: middle或align-items: center居中
常见坑：图片不显示 / 错位 / 点击穿透
自定义导航栏不是“加个图就完事”，以下问题高频出现：
-
src路径写错：必须是本地静态资源路径（/static/logo.png），网络地址在部分平台（尤其微信小程序）会被拦截或不加载 - 没占满宽度：父容器未设
display: flex或justify-content: center，导致图片靠左 - 安卓状态栏透出：未给
.status-bar-placeholder设背景色，或未设z-index，造成下方内容上顶 - 返回按钮点击失效：自定义区域覆盖了原生返回手势区域，需手动加
<view class="back-btn"></view>并留出安全间距
要不要封装成公共组件？
如果多个页面都要图片标题，封装值得做，但注意两点：
- 别把
statusBarHeight写死 —— 必须在onLoad或onReady里调uni.getSystemInfoSync()动态获取并传给子组件 - 别在组件内硬编码
env(safe-area-inset-top)：H5 和旧版 Android 不支持，要用@supports或运行时判断降级
真正麻烦的从来不是加一张图，而是让这张图在 iOS 安全区、安卓刘海屏、H5 浏览器、各种小程序容器里都稳稳居中、不溢出、不被截断 —— 这些细节不测到真机，光看模拟器永远发现不了。
