uni-app uni.getSystemInfoSync() 获取到 osTheme 和 Theme 不一致，uni.onThemeChange，onThemeChange 都无效

uni-app uni.getSystemInfoSync() 获取到 osTheme 和 Theme 不一致，uni.onThemeChange，onThemeChange 都无效

测试过的手机：

荣耀v20，华为meta70pro+

操作步骤：

  • 通过 uni.getSystemInfoSync() 获取到 osTheme 和 Theme
  • uni.onThemeChange
  • App.vue 中写上 onThemeChange 生命周期

预期结果：

  • 获取到 osTheme 和 Theme 一致并正确
  • 切换主题时uni.onThemeChange，onThemeChange

实际结果：

  1. 通过 uni.getSystemInfoSync() 获取到 osTheme 和 Theme 不一致，官方文档描述使用 Theme
  2. uni.onThemeChange无效，切换主题不触发
  3. App.vue 中写上 onThemeChange 生命周期无效，切换主题不触发
    已经在 manifest.json 对应平台配置中声明了"darkmode": true

bug描述：

  1. 通过 uni.getSystemInfoSync() 获取到 osTheme 和 Theme 不一致，官方文档描述使用 Theme
  2. uni.onThemeChange无效，切换主题不触发
  3. App.vue 中写上 onThemeChange 生命周期无效，切换主题不触发
    已经在 manifest.json 对应平台配置中声明了"darkmode": true

Image Image


更多关于uni-app uni.getSystemInfoSync() 获取到 osTheme 和 Theme 不一致，uni.onThemeChange，onThemeChange 都无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app uni.getSystemInfoSync() 获取到 osTheme 和 Theme 不一致，uni.onThemeChange，onThemeChange 都无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个已知的兼容性问题，主要出现在部分华为/荣耀机型上。这些设备的系统主题检测机制与标准Android实现存在差异。

问题分析：

  1. osTheme 和 theme 不一致是因为系统层返回的主题状态与应用层感知状态不同步
  2. 主题切换监听失效是由于系统未正确发送主题变更广播

解决方案：

临时方案：

// 使用轮询方式检测主题变化
setInterval(() => {
  const systemInfo = uni.getSystemInfoSync();
  // 以 theme 字段为准，忽略 osTheme
  console.log('当前主题:', systemInfo.theme);
}, 1000);

推荐方案：

// 在页面中使用 CSS 媒体查询
[@media](/user/media) (prefers-color-scheme: dark) {
  /* 深色主题样式 */
}
[@media](/user/media) (prefers-color-scheme: light) {
  /* 浅色主题样式 */
}
回到顶部