大数跨境

微信小程序放弃getSystemInfoSync,拆分成职责独立的5个同步 API

微信小程序放弃getSystemInfoSync,拆分成职责独立的5个同步 API wordpress知识
2026-10-28
6

微信小程序系统信息API重构:从单一接口到五大专项API

微信官方对系统信息获取能力进行了拆分重构,将原本通过 wx.getSystemInfoSync 一次性返回几十项字段(涵盖布局、设备、版本、权限等)的臃肿模式,优化为5个职责单一的同步API。新方案支持按需获取数据,无需 success 回调,使代码逻辑更清晰,维护成本更低。

以下5个接口均无入参,采用同步调用方式直接返回结果。

1. wx.getWindowInfo():UI适配核心

作用:获取窗口布局、状态栏高度、安全区域及屏幕尺寸,是进行UI适配的首选接口。

// 获取窗口信息
const winInfo = wx.getWindowInfo()
// 计算iPhone底部安全距离(避开手势条)
const bottomSafePadding = winInfo.safeArea ? winInfo.windowHeight - winInfo.safeArea.bottom : 0
console.log('状态栏高度:', winInfo.statusBarHeight)
console.log('底部安全距离:', bottomSafePadding)
// 单独获取状态栏高度示例
const winInfo = wx.getWindowInfo()
const statusBarHeight = winInfo.statusBarHeight
console.log('状态栏高度:', statusBarHeight)

2. wx.getDeviceInfo():设备特征识别

作用:获取设备品牌、型号及系统平台,常用于区分 iOS 与 Android 环境。

const deviceInfo = wx.getDeviceInfo()
// 判断平台
if(deviceInfo.platform === 'ios') {
  console.log('当前是苹果设备')
}else if(deviceInfo.platform === 'android') {
  console.log('当前是安卓设备')
}

3. wx.getAppBaseInfo():应用基础环境

作用:获取微信客户端版本、基础库版本、深色主题状态及字体缩放比例。

const appBaseInfo = wx.getAppBaseInfo()
// 深色模式判断
if (appBaseInfo.theme === 'dark') {
  console.log('用户开启深色模式,切换深色样式')
}
// 基础库版本兼容判断
console.log('当前基础库版本:', appBaseInfo.SDKVersion)

4. wx.getSystemSetting():系统开关检测

作用:读取定位、蓝牙、WiFi等功能的系统级总开关状态(注意:此为非小程序授权层面的系统设置)。

const systemSetting = wx.getSystemSetting()
// 检测系统定位开关是否打开
if (!systemSetting.locationEnabled) {
  wx.showToast({
     title: '请先在手机设置开启定位',
     icon: 'none'
  })
}

5. wx.getMenuButtonBoundingClientRect():胶囊按钮坐标

作用:获取右上角胶囊按钮的位置信息,是实现自定义导航栏的核心接口。

const winInfo = wx.getWindowInfo()
const capsule = wx.getMenuButtonBoundingClientRect()
// 计算自定义导航栏高度(行业通用公式)
const navHeight = winInfo.statusBarHeight + capsule.height + (capsule.top - winInfo.statusBarHeight) * 2
console.log('导航栏高度:', navHeight)

总结:各司其职,按需调用

新版API体系告别了 getSystemInfoSync 全量返回的冗余写法,实现了模块化分工:

  • UI布局数据(状态栏、安全区):使用 wx.getWindowInfo
  • 设备平台判断:使用 wx.getDeviceInfo
  • 环境与主题(深色模式、基础库版本):使用 wx.getAppBaseInfo
  • 系统功能开关(定位、蓝牙):使用 wx.getSystemSetting
  • 自定义导航栏:搭配 wx.getMenuButtonBoundingClientRect 获取胶囊位置

这种按需调用的方式不仅让代码更加清爽,也极大地提升了后续逻辑维护与新特性适配的效率。

#微信小程序

【声明】内容源于网络
0
0
wordpress知识
各类跨境出海行业相关资讯
内容 385
粉丝 0
wordpress知识 各类跨境出海行业相关资讯
总阅读14.9k
粉丝0
内容385