uni-app怎么获取系统信息 uni-app判断设备型号与平台【技巧】

月夜之吻

月夜之吻

2026-03-24

377人浏览

原创

优先用 uni.getsysteminfosync() 初始化快速读取,但需 try/catch 防 h5 或鸿蒙失败;异步 uni.getsysteminfo() 更稳妥。platform 最稳判平台,osname 辨纯血鸿蒙,uniplatform 是编译目标。

uni-app怎么获取系统信息 uni-app判断设备型号与平台【技巧】

uni.getSystemInfoSync() 和 uni.getSystemInfo() 怎么选

同步接口 uni.getSystemInfoSync() 立即返回结果,适合初始化时快速读取(比如设置状态栏高度、判断平台做条件渲染);异步接口 uni.getSystemInfo() 走回调或 Promise,更稳妥,尤其在小程序环境或某些低端安卓机上,避免因系统信息未就绪导致 undefined 报错。

  • 页面 onLoad 里想马上用 statusBarHeight?用 uni.getSystemInfoSync(),但务必加 try/catch —— H5 下可能抛错,微信小程序真机有时也慢半拍
  • 需要等所有信息加载完再渲染关键 UI?封装成 Promise + await 更可控,Vue 3 的 <script setup></script> 里直接写 const info = await getSystemInfoAsync()
  • 别在 App.vueonLaunch 里无防护调 uni.getSystemInfoSync() —— 某些鸿蒙版本或旧版 HBuilderX 会静默失败,导致后续逻辑崩掉

platform、osName、uniPlatform 这三个字段到底谁靠谱

判断“当前跑在哪”不能只看一个字段:platform 是最常用也最稳定的,返回 "ios""android""devtools""web"osName 来自 uni.getDeviceInfoSync().osName,能区分纯血鸿蒙("harmony"),但模拟器/非纯血鸿蒙仍报 "android"uniPlatform 是编译目标平台(如 "mp-weixin""h5"),跟运行时设备无关,别拿它当设备类型用。

  • 要兼容鸿蒙且需精确识别纯血鸿蒙?必须组合判断:uni.getDeviceInfoSync()?.osName === 'harmony',但得先 uni.canIUse('getDeviceInfoSync') 守住底线
  • 写条件编译时发现 platform === 'ios' 在微信开发者工具里也成立?对,因为工具模拟的是 iOS 环境,此时应结合 uni.getSystemInfoSync().hostName(值为 "wechat")或 uni.getSystemInfoSync().uniPlatform(值为 "mp-weixin")进一步确认宿主
  • 别信 model 字段识别厂商 —— 华为手机返回 "HUAWEI ANA-AN00",小米可能是 "Xiaomi 2201122C",没统一规则,仅作日志参考

获取 App 版本号为什么 plus.runtime.getProperty 有时不生效

plus.runtime.getProperty 是 5+ SDK 特有 API,只在打包成原生 App(Android/iOS)时可用,H5、小程序里直接报 plus is not defined;而 uni.getSystemInfoSync().appVersion 在所有平台都存在,但注意:H5 下它返回的是 manifest.json 里填的版本,不是浏览器本身版本。

  • 跨平台项目想统一取版本?优先用 uni.getSystemInfoSync().appVersion,它在 App、小程序、H5 均有值(H5 值来自配置,App 和小程序来自原生包)
  • 需要取 Android 的 versionCode 或 iOS 的 buildNumber?只能走 plus.runtime.getProperty,但必须加运行时判断:if (typeof plus !== 'undefined') { ... }
  • 微信小程序里看到 appVersion 是空字符串?检查 project.config.jsonminiprogramRoot 是否正确,以及是否在 app.json 中配置了 versionName(部分低版本基础库需手动透出)

安全区(safeArea)和 statusBarHeight 在不同平台表现不一致

statusBarHeight 在 iOS 上是真实状态栏高度(通常 44 或 64),在 Android 上多数为 24–28,但部分全面屏机型(尤其华为、OPPO)可能返回 0;safeArea 对象在 iOS 和微信小程序中完整可用,在 H5 和部分安卓 App 中可能缺失或不准确。

  • 做顶部固定导航栏?别只依赖 statusBarHeight,优先用 safeAreaInsets?.top,它更语义化,且鸿蒙、iOS、小程序都支持
  • H5 下 safeArea 为空?可以 fallback 到 env = window.navigator.standalone ? 'ios' : 'h5' + 经验值(如 iOS Safari 为 44,Chrome 安卓为 24)
  • 在 App.vue 里用 onShow 动态监听 safeArea 变化?目前 uni-app 不支持监听,只能首次获取后缓存,或在页面级重新拉取

鸿蒙识别、H5 fallback、plus 兼容性、safeArea 缺失——这些边界情况不会报错,但会让 UI 错位或逻辑跳变,上线前一定得在真机上逐个平台点开调试器看 console 输出的实际字段值。

数码产品性能查询
数码产品性能查询

该软件包括了市面上所有手机CPU,手机跑分情况,电脑CPU,电脑产品信息等等,方便需要大家查阅数码产品最新情况,了解产品特性,能够进行对比选择最具性价比的商品。

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
python是前端还是后端
python是前端还是后端

Python属于前端也属于后端,其灵活性和丰富的生态系统使得开发人员能够在不同的领域中灵活运用。本专题为大家提供python相关的文章、下载、课程内容,供大家免费下载体验。

2023.08.11

1062

5

前端如何实现即时通讯
前端如何实现即时通讯

实现即时通讯的方法有WebSocket、Long Polling、Server-Sent Events、WebRTC等等。详细介绍:1、WebSocket,它可以在客户端和服务器之间建立持久连接,实现实时的双向通信,前端可以使用 WebSocket API来创建WebSocket连接,并通过发送和接收消息来实现即时通讯;2、Long Polling,是一种模拟实时通信的技术等等。

2023.10.09

2187

6

前端和后端的区别
前端和后端的区别

前端关注的是用户界面的设计和交互,而后端则注重数据处理和逻辑控制。想了解更多前端后端的相关内容,可以阅读本专题下面的文章。

2024.03.19

2080

13

php和前端的关联介绍
php和前端的关联介绍

php既可以作为前端语言,也可以作为后端语言。想了解更多php和前端的相关内容,可以阅读本专题下面的文章。

2024.03.22

2229

10

前端外包工作内容有哪些
前端外包工作内容有哪些

前端外包工作内容包括:1. 网站和应用程序开发;2. 用户界面和交互设计;3. 用户体验优化;4. 设计和视觉开发;5. 跨浏览器兼容性;6. 性能优化;7. 维护和更新;8. 项目管理和沟通。想了解更多前端的相关内容,可以阅读本专题下面的文章。

2024.05.22

333

5

火山引擎云服务器使用教程
火山引擎云服务器使用教程

火山引擎云服务器使用教程适合第一次购买、部署和管理云服务器的用户参考。本专题整理控制台入口、实例创建、地域和配置选择、系统镜像设置、安全组放行、远程连接、网站部署、续费计费和常见连接失败问题,帮助用户快速完成云服务器基础使用流程。

2026.08.04

2

10

火山引擎API Key绑定大模型教程
火山引擎API Key绑定大模型教程

火山引擎API Key怎么绑定大模型适合需要在火山方舟、应用后台、脚本工具或AI编程软件中调用模型的开发者参考。本专题整理控制台服务开通、API Key创建、模型权限检查、模型ID选择、Base URL填写、调用测试和鉴权失败排查,帮助用户完成从密钥到模型调用的配置流程。

2026.08.04

2

10

火山引擎API Key获取教程
火山引擎API Key获取教程

火山引擎API Key适合需要调用火山引擎云服务、AI模型、火山方舟接口或其他开放能力的开发者参考。本专题整理控制台入口、账号认证、服务开通、API Key创建、密钥复制保存、权限检查、调用测试和Key无效等常见问题排查。

2026.08.04

6

10

火山引擎API接入教程
火山引擎API接入教程

火山引擎API接入适合需要在应用、脚本、后台服务或AI工具中调用火山引擎能力的开发者参考。本专题整理控制台入口、服务开通、API Key获取、接口地址配置、请求参数填写、调用测试、权限设置、额度查询和常见接口报错排查。

2026.08.04

5

10

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
热门推荐
/
最新课程
phpStudy极速入门视频教程
phpStudy极速入门视频教程

共6课时 | 54.4万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时 | 131.8万人学习