支持 web-view 导航栏显隐控制

.agents/skills/mpx2rn/references/rn-template-reference.md

@@ -1431,6 +1431,24 @@ level 有效值：
 | 属性名 | 类型 | 默认值 | 说明 |
 | --- | --- | --- | --- |
 | src | string |  | webview 指向网页的链接，如果需要对跳转的 URL 设定白名单可跳转，需要在业务跳转之前处理该逻辑 |
+| show-navigation-bar | boolean | `undefined` | 仅 RN：`true` 显示导航，`false` 隐藏；未传入时沿用页面导航配置，支持动态更新 |
+
+RN 下 `web-view` 默认沿用页面导航配置，页面设置 `navigationStyle: 'custom'` 时导航保持隐藏。H5 可通过 `@mpxjs/webview-bridge` 的 `invoke('hideNavigationBar')` / `invoke('showNavigationBar')` 主动覆盖页面配置，隐藏或显示导航，无需在 `apiImplementations` 中注册。调用支持可选的 `success`、`fail`、`complete` 回调，成功返回 `{ errMsg: 'hideNavigationBar:ok' }` 或 `{ errMsg: 'showNavigationBar:ok' }`。这两个内建调用仅在 RN 容器中生效。
+
+`show-navigation-bar` 属性变化和 H5 bridge 调用以最近一次操作为准；属性值不变时，不会覆盖 H5 后续调用，属性改为 `undefined` 时恢复页面原配置。改变 `src`、H5 跳转或路由切换不会自动重置显隐状态，URL 参数不控制导航；需要随 H5 路由变化时，由业务在路由切换后主动调用。卸载时清除显隐覆盖并恢复页面原配置，重新挂载时按当前属性初始化，未传属性则沿用页面配置。系统状态栏仍保留。WebView 随页面容器自动铺满，宿主 API 的窗口尺寸与坐标数据仍按原页面配置计算。一个页面同时使用一个 `web-view`。
+
+```html
+<!-- 在 Mpx 页面中控制 RN 导航显隐 -->
+<web-view src="{{url}}" show-navigation-bar@ios|android|harmony="{{showNavigationBar}}"></web-view>
+```
+
+```js
+// 在被打开的 H5 中调用
+import webviewBridge from '@mpxjs/webview-bridge'
+
+webviewBridge.invoke('hideNavigationBar') // 隐藏
+webviewBridge.invoke('showNavigationBar') // 显示，按需调用其中一个
+```
 
 #### 事件
 

docs-vitepress/guide/rn/component.md

@@ -714,6 +714,24 @@ API
 | 属性名                   | 类型     | 默认值         | 说明                                                       |
 | ----------------------- | ------- | ------------- | ---------------------------------------------------------- |
 | src	    | string  |               | webview 指向网页的链接，如果需要对跳转的URL设定白名单可跳转，需要在业务跳转之前处理该逻辑
+| show-navigation-bar | boolean | `undefined` | 仅 RN：`true` 显示导航，`false` 隐藏；未传入时沿用页面导航配置，支持动态更新 |
+
+RN 下 `web-view` 默认沿用页面导航配置，页面设置 `navigationStyle: 'custom'` 时导航保持隐藏。H5 可通过 `@mpxjs/webview-bridge` 的 `invoke('hideNavigationBar')` / `invoke('showNavigationBar')` 主动覆盖页面配置，隐藏或显示导航，无需在 `apiImplementations` 中注册。调用支持可选的 `success`、`fail`、`complete` 回调，成功返回 `{ errMsg: 'hideNavigationBar:ok' }` 或 `{ errMsg: 'showNavigationBar:ok' }`。这两个内建调用仅在 RN 容器中生效。
+
+`show-navigation-bar` 属性变化和 H5 bridge 调用以最近一次操作为准；属性值不变时，不会覆盖 H5 后续调用，属性改为 `undefined` 时恢复页面原配置。改变 `src`、H5 跳转或路由切换不会自动重置显隐状态，URL 参数不控制导航；需要随 H5 路由变化时，由业务在路由切换后主动调用。卸载时清除显隐覆盖并恢复页面原配置，重新挂载时按当前属性初始化，未传属性则沿用页面配置。系统状态栏仍保留。WebView 随页面容器自动铺满，宿主 API 的窗口尺寸与坐标数据仍按原页面配置计算。一个页面同时使用一个 `web-view`。
+
+```html
+<!-- 在 Mpx 页面中控制 RN 导航显隐 -->
+<web-view src="{{url}}" show-navigation-bar@ios|android|harmony="{{showNavigationBar}}"></web-view>
+```
+
+```js
+// 在被打开的 H5 中调用
+import webviewBridge from '@mpxjs/webview-bridge'
+
+webviewBridge.invoke('hideNavigationBar') // 隐藏
+webviewBridge.invoke('showNavigationBar') // 显示，按需调用其中一个
+```
 
 事件
 

packages/core/src/platform/patch/getDefaultOptions.ios.js

@@ -572,6 +572,11 @@ export function PageWrapperHOC (WrappedComponent, pageConfig = {}) {
       error('Using pageWrapper requires passing navigation and route')
       return null
     }
+    navigation.setWebViewShowNav = (showNav) => {
+      navigation.setPageConfig({
+        navigationStyle: showNav === undefined ? currentPageConfig.navigationStyle : (showNav ? undefined : 'custom')
+      })
+    }
     const headerHeight = useInnerHeaderHeight(currentPageConfig)
     navigation.layout = getLayoutData(headerHeight)
 

packages/webpack-plugin/lib/runtime/components/react/mpx-web-view.tsx

@@ -1,4 +1,4 @@
-import { forwardRef, useRef, useContext, useMemo, useState } from 'react'
+import { forwardRef, useRef, useContext, useMemo, useState, useLayoutEffect } from 'react'
 import { warn, isFunction } from '@mpxjs/utils'
 import Portal from './mpx-portal/index'
 import { usePreventRemove, PreventRemoveEvent } from '@react-navigation/native'
@@ -30,6 +30,7 @@ type CommonCallbackEvent = {
 
 interface WebViewProps {
   src?: string
+  'show-navigation-bar'?: boolean
   bindmessage?: (event: OnMessageCallbackEvent) => void
   bindload?: (event: CommonCallbackEvent) => void
   binderror?: (event: CommonCallbackEvent) => void
@@ -84,7 +85,7 @@ const styles = StyleSheet.create({
 })
 
 const _WebView = forwardRef<HandlerRef<WebViewInstance, WebViewProps>, WebViewProps>((props, ref): JSX.Element | null => {
-  const { src, bindmessage, bindload, binderror } = props
+  const { src, 'show-navigation-bar': showNavigationBar, bindmessage, bindload, binderror } = props
   const mpx = global.__mpx
   const errorText: ErrorTextMap = {
     'zh-CN': {
@@ -103,6 +104,7 @@ const _WebView = forwardRef<HandlerRef<WebViewInstance, WebViewProps>, WebViewPr
   }
   const { pageId } = useContext(RouteContext) || {}
   const [pageLoadErr, setPageLoadErr] = useState<boolean>(false)
+  const [showNav, setShowNav] = useState<boolean | undefined>(showNavigationBar)
   const currentPage = useMemo(() => getCurrentPage(pageId), [pageId])
   const webViewRef = useRef<WebViewInstance>(null)
   const fristLoaded = useRef<boolean>(false)
@@ -153,6 +155,20 @@ const _WebView = forwardRef<HandlerRef<WebViewInstance, WebViewProps>, WebViewPr
     }
   }
 
+  useLayoutEffect(() => {
+    setShowNav(showNavigationBar)
+  }, [showNavigationBar])
+
+  useLayoutEffect(() => {
+    // 属性和 H5 均未指定显隐时，沿用页面导航配置。
+    if (showNav === undefined) return
+    const applyShowNav = navigation?.setWebViewShowNav
+    if (!applyShowNav) return
+    applyShowNav(showNav)
+    // 卸载或显隐变化时清除旧覆盖，恢复页面配置。
+    return () => applyShowNav(undefined)
+  }, [navigation, showNav])
+
   if (!src) {
     return null
   }
@@ -231,6 +247,11 @@ const _WebView = forwardRef<HandlerRef<WebViewInstance, WebViewProps>, WebViewPr
     const params = Array.isArray(args) ? args : [postData]
     const type = data.type
     switch (type) {
+      case 'hideNavigationBar':
+      case 'showNavigationBar':
+        setShowNav(type === 'showNavigationBar')
+        asyncCallback = Promise.resolve({ errMsg: `${type}:ok` })
+        break
       case 'setTitle':
         { // case下不允许直接声明，包个块解决该问题
           const title = postData._documentTitle?.trim()