uni-app uni.getSystemInfoSync 返回的deviceOrientation不对

发布于 1周前 作者 bupafengyu 来自 Uni-App

uni-app uni.getSystemInfoSync 返回的deviceOrientation不对

操作步骤

横屏打开手机 进入新的页面调用uni.getSystemInfoSync 返回的deviceOrientation是portrait

预期结果

返回正确的landscape

实际结果

返回portrait

bug描述

横屏打开手机 进入新的页面调用uni.getSystemInfoSync 返回的deviceOrientation是portrait

开发环境与版本信息

项目创建方式 PC开发环境操作系统 PC开发环境操作系统版本号 HBuilderX类型 HBuilderX版本号 手机系统 手机系统版本号 手机厂商 手机机型 页面类型 vue版本 打包方式
HBuilderX Mac 10.15.7 正式 4.29 iOS iOS 18 苹果 iPhone 16 pro max vue vue2 云端

1 回复

在处理 uni-appuni.getSystemInfoSync 返回的 deviceOrientation 不对的问题时,首先我们需要了解 uni.getSystemInfoSync 方法是用来同步获取系统信息的,包括设备型号、系统版本、屏幕宽度、屏幕高度等信息。deviceOrientation 是其中一项,它表示设备的方向(例如,‘portrait’ 表示竖屏,‘landscape’ 表示横屏)。

如果你发现 deviceOrientation 返回的值不正确,可能是由于多种原因造成的,包括但不限于设备兼容性问题、代码逻辑错误或者 uni-app 框架本身的bug。以下是一个基本的代码示例,展示了如何使用 uni.getSystemInfoSync 获取设备信息,并打印 deviceOrientation

// 在页面的onLoad或者onReady生命周期中调用
onLoad() {
    // 获取系统信息
    const systemInfo = uni.getSystemInfoSync();
    
    // 打印设备方向
    console.log('设备方向:', systemInfo.deviceOrientation);
    
    // 根据设备方向做一些处理
    if (systemInfo.deviceOrientation === 'portrait') {
        console.log('当前是竖屏模式');
        // 执行竖屏模式下的操作
    } else if (systemInfo.deviceOrientation === 'landscape') {
        console.log('当前是横屏模式');
        // 执行横屏模式下的操作
    } else {
        console.log('未知的设备方向:', systemInfo.deviceOrientation);
    }
}

如果上述代码中的 deviceOrientation 仍然返回不正确的值,我们可以考虑以下几点进行进一步的排查:

  1. 确认设备支持:确保你的测试设备支持 deviceOrientation 属性的获取。

  2. 监听屏幕旋转事件:使用 uni.onWindowResize 或者原生的事件监听(如 window.addEventListener('resize', callback))来动态监听屏幕大小变化,从而间接判断设备方向的变化。

  3. 检查框架版本:确认你使用的 uni-app 框架版本是否为最新,或者查看该版本的已知问题列表,看是否有相关的bug报告。

  4. 设备兼容性测试:在多种设备上进行测试,以排除特定设备的兼容性问题。

  5. 查阅官方文档和社区:访问 uni-app 的官方文档或者社区论坛,查看是否有其他开发者遇到并解决了类似的问题。

通过上述步骤,你应该能够更准确地定位问题所在,并采取相应的措施解决 deviceOrientation 返回不正确的问题。

回到顶部