uni-app uni.getWindowInfo()在app-nvue vue3模式中调用无反应

示例代码：

export default {
  onLaunch: function() {
    uni.getWindowInfo({
      success: res => {
        console.log('App 启动--------------------', res);
      },
      fail: err => {
        console.error('App 启动--------------------', err);
      }
    })
  }
}

操作步骤：

新建app-nvue vue3版本的项目，把实力代码拷进app.vue里面即可

预期结果：

success中可以回调出窗口信息

实际结果：

没有任何反应

bug描述：

uni.getWindowInfo在项目中调用没有反应，但是uni.getSystemInfo是可以调用，应该是app-nvue vue3版本不支持getWindowInfo，希望可以修复一下


| 信息类别       | 信息内容           |
|----------------|--------------------|
| 产品分类       | uniapp/App         |
| PC开发环境     | Windows            |
| PC开发环境版本 | win10              |
| HBuilderX类型  | 正式               |
| HBuilderX版本  | 3.96               |
| 手机系统       | Android            |
| 手机系统版本   | Android 7.1.1      |
| 手机厂商       | 京东               |
| 手机机型       | 平板               |
| 页面类型       | nvue               |
| Vue版本        | vue3               |
| 打包方式       | 离线               |
| 项目创建方式   | HBuilderX          |

ionicwang 1楼•4 天前

实例代码中复制错了应该是调用 getWindowInfo

phonegap100 2楼•4 天前

在 uni-app 的 app-nvue 模式下，使用 uni.getWindowInfo() 时可能会遇到无反应的情况，尤其是在 vue3 模式下。以下是一些可能的原因和解决方案：

1. 检查 `uni.getWindowInfo()` 的兼容性

uni.getWindowInfo() 是 uni-app 提供的一个 API，用于获取窗口信息。但在 app-nvue 模式下，某些 API 可能不完全支持或行为有所不同。确保你使用的 uni-app 版本支持该 API。

2. 确保在正确的生命周期中调用

在 vue3 中，确保你在组件的生命周期钩子中调用 uni.getWindowInfo()，例如 onMounted 或 onLoad。如果在组件尚未挂载时调用，可能会导致无反应。

import { onMounted } from 'vue';

onMounted(() => {
  const windowInfo = uni.getWindowInfo();
  console.log(windowInfo);
});

3. 检查 `nvue` 页面的配置

在 app-nvue 模式下，确保你的页面配置正确。nvue 页面的配置与普通 vue 页面有所不同，可能需要额外的配置。

4. 使用 `uni.getSystemInfoSync()` 替代

如果 uni.getWindowInfo() 在 app-nvue 模式下无法正常工作，可以尝试使用 uni.getSystemInfoSync() 来获取系统信息，它可能更稳定。

const systemInfo = uni.getSystemInfoSync();
console.log(systemInfo);

5. 检查 `uni-app` 版本

确保你使用的 uni-app 版本是最新的，或者至少是支持 uni.getWindowInfo() 的版本。你可以通过以下命令更新 uni-app：

npm update @dcloudio/uni-app

6. 调试和日志

在调用 uni.getWindowInfo() 时，添加调试日志，确保代码执行到该处。如果代码未执行，可能是由于某些条件未满足或代码逻辑问题。

console.log('Before calling uni.getWindowInfo()');
const windowInfo = uni.getWindowInfo();
console.log('After calling uni.getWindowInfo()', windowInfo);

7. 检查 `nvue` 页面的渲染模式

nvue 页面使用的是原生渲染，可能与 vue 页面的行为有所不同。确保你理解 nvue 页面的渲染机制，并在必要时调整代码。

8. 官方文档和社区支持

查阅 uni-app 的官方文档，了解 uni.getWindowInfo() 在 app-nvue 模式下的具体支持情况。如果问题仍然存在，可以在 uni-app 社区或论坛中寻求帮助。

示例代码

以下是一个在 vue3 中使用 uni.getWindowInfo() 的示例：

<template>
  <view>
    <text>Window Info: {{ windowInfo }}</text>
  </view>
</template>

<script>
import { ref, onMounted } from 'vue';

export default {
  setup() {
    const windowInfo = ref(null);

    onMounted(() => {
      windowInfo.value = uni.getWindowInfo();
      console.log(windowInfo.value);
    });

    return {
      windowInfo,
    };
  },
};
</script>