Y 已解决

产品分类：  
uniapp/App  

PC开发环境操作系统：  
Mac  

PC开发环境操作系统版本号：  
13.7.5  

手机系统：  
iOS  

手机系统版本号：  
iOS 17  

手机厂商：  
苹果  

手机机型：  
15 pro  

页面类型：  
nvue  

vue版本：  
vue3  

打包方式：  
离线  

项目创建方式：  
CLI  

CLI版本号：  
3.0  

### 操作步骤：
- 运行项目到 ios 中打开承载着 webview 组件的 nvue 页面，并设置 webview 的宽高是屏幕的宽高  

### 预期结果：
- ios端的 webview 不被状态栏遮盖  

### 实际结果：
- 无

h691938207 1楼

在 iOS 的 nvue 页面中，WebView 组件默认会延伸到状态栏下方，导致内容被遮挡。可以通过以下方式解决：

使用 uni.getSystemInfoSync() 获取状态栏高度，并动态设置 WebView 的顶部边距：

const systemInfo = uni.getSystemInfoSync()
const statusBarHeight = systemInfo.statusBarHeight

在模板中设置 WebView 的样式：

<webview :style="{ marginTop: statusBarHeight + 'px', height: `calc(100vh - ${statusBarHeight}px)` }"></webview>

如果使用 uni-app 的 pages.json 配置，确保页面已正确设置导航栏和状态栏样式：

{
  "pages": [{
    "path": "pages/your-page",
    "style": {
      "navigationStyle": "custom",
      "app-plus": {
        "titleNView": false
      }
    }
  }]
}

对于 iOS 安全区域适配，可以结合 safe-area-inset-top 使用：

webview {
  padding-top: constant(safe-area-inset-top);
  padding-top: env(safe-area-inset-top);
}