在横屏的设备上把uni-app app底部导航栏隐藏(虚拟按键)后，打开页面出现高度异常(不能全屏显示)，会出现第一个页面的界面

倒闭吧

更多关于在横屏的设备上把uni-app app底部导航栏隐藏(虚拟按键)后，打开页面出现高度异常(不能全屏显示)，会出现第一个页面的界面的实战教程也可以访问 https://www.itying.com/category-93-b0.html

bupafengyu 2楼

这是一个常见的适配问题，主要原因是隐藏底部导航栏后，应用窗口高度发生变化，但页面布局未及时更新。以下是几种解决方案：

使用 plus.navigator.setFullscreen(true) 隐藏导航栏时，需要在页面 onReady 后调用 uni.getSystemInfo 获取最新屏幕高度，并动态设置页面容器高度。
在 pages.json 中配置对应页面的 style：

{
  "path": "pages/index/index",
  "style": {
    "app-plus": {
      "titleNView": false,
      "fullscreen": true
    }
  }
}

通过 CSS 适配：

page {
  height: 100vh;
}
.content {
  height: 100vh;
  box-sizing: border-box;
}

在 onLoad 生命周期中处理：

onLoad() {
  // 隐藏虚拟按键
  plus.navigator.setFullscreen(true);
  // 重置页面高度
  setTimeout(() => {
    uni.getSystemInfo({
      success: (res) => {
        this.windowHeight = res.windowHeight;
      }
    });
  }, 100);
}