uniapp开发定义globalData全局数并调用

在 UniApp 中,你可以通过 getApp() 方法来获取全局应用实例,并在其上定义 globalData 来存储全局数据。以下是如何定制 globalData 并调用它的步骤:

  1. 定义 globalData:
    App.vue 文件中,你可以定义 globalData 对象。

    // App.vue
    <script>
    export default {
      globalData: {
        userInfo: null,
        token: ''
      },
      onLaunch() {
        console.log('App Launch');
      },
      onShow() {
        console.log('App Show');
      },
      onHide() {
        console.log('App Hide');
      }
    };
    </script>
  2. 调用 globalData:
    在其他页面或组件中,你可以通过 getApp() 方法来访问 globalData

    // pages/index/index.vue
    <script>
    export default {
      data() {
        return {
          localUserInfo: null
        };
      },
      onLoad() {
        const app = getApp();
        this.localUserInfo = app.globalData.userInfo;
        console.log(this.localUserInfo);
      }
    };
    </script>
  3. 修改 globalData:
    如果你需要修改 globalData 中的数据,可以直接赋值。

    // pages/login/login.vue
    <script>
    export default {
      methods: {
        login() {
          const app = getApp();
          app.globalData.userInfo = { name: '张三', age: 25 };
          console.log(app.globalData.userInfo);
        }
      }
    };
    </script>

通过以上步骤,你可以在 UniApp 中定义和使用 globalData 来管理全局状态。

0 条评论

还没有人发表评论

发表评论 取消回复

记住我的信息,方便下次评论
有人回复时邮件通知我