uniapp中window.app的用法是什么

在uniapp中，window.app具体是用来做什么的？它和普通的Vue实例有什么区别？在开发中应该如何使用这个全局对象？有没有实际的应用场景或代码示例可以参考？

2 回复

uniapp中window.app是全局对象，用于访问应用实例。可通过它调用全局方法，如获取页面栈、路由跳转等。但官方推荐使用getApp()获取应用实例，更安全稳定。


在uni-app中，window.app 并不是官方推荐或标准用法，但有时开发者会用它来存储全局变量或方法。以下是常见用法和注意事项：

主要用法

  1. 存储全局变量或方法
    在 App.vue 的 onLaunch 中定义，例如：

    // App.vue
export default {
  onLaunch() {
    // 将全局方法或数据挂载到 window.app
    window.app = {
      globalData: { userId: '123' },
      showToast(message) {
        uni.showToast({ title: message, icon: 'none' });
      }
    };
  }
};

  2. 在其他页面调用
    在页面或组件中直接使用：

    // 任意页面
mounted() {
  if (window.app) {
    console.log(window.app.globalData.userId); // 输出 '123'
    window.app.showToast('Hello'); // 调用全局方法
  }
}

注意事项

  • 类型不安全：window.app 没有类型约束，容易导致运行时错误。
  • 替代方案：推荐使用 Vue 的全局属性或状态管理（如 Vuex/Pinia）：
    // main.js 中挂载全局属性
import { createApp } from 'vue';
const app = createApp(...);
app.config.globalProperties.$app = { ... };

总结

window.app 可用于快速共享数据，但缺乏维护性。建议在复杂项目中优先使用 Vue 官方状态管理工具。

回到顶部