uni-app中获取参数的几个方法

文章目录


1、onLoad

javascript 复制代码
// 页面中常用获取方法
export default {
  onLoad(options) {
    console.log('onLoad自带参数', options)
  },
}

2、onLaunch

javascript 复制代码
// App.vue
export default {
  onLaunch() {
    const res = uni.getLaunchOptionsSync();
    // 获取启动参数
    const { id, type } = res.query;
    console.log('APP启动参数:', id, type);
  }
}

3、uni.getLaunchOptionsSync()

javascript 复制代码
// 在任意页面获取项目启动时的参数
const launch = uni.getLaunchOptionsSync();
console.log('启动参数(全局):', launch.query);

4、getCurrentPages()

javascript 复制代码
// 在页面中其他位置获取
export default {
  onShow() {
    const params = this.getPageParams();
    console.log(params);
  },
  methods: {
    getPageParams() {
      const pages = getCurrentPages();
      const currPage = pages[pages.length - 1];
      return currPage.options || {};
    }
  }
}

5、getCurrentPages().pop().options

javascript 复制代码
// 在页面中其他位置获取
export default {
  created() {
    console.log('created参数', getCurrentPages().pop().options)
  },
  onLoad(options) {
    console.log('onLoad自带参数', options)
    console.log('onLoad API获取参数', getCurrentPages().pop().options)
  },
  mounted() {
    console.log('mounted参数', getCurrentPages().pop().options)
  },
  onShow() {
    console.log('onShow参数', getCurrentPages().pop().options)
  }
}
相关推荐
爱折腾的编程老炮2 小时前
潮玩小程序订单模型-一张表装下所有玩法
spring boot·小程序·uni-app
两个人的幸福online2 小时前
UniApp 对接 IM 即时通讯全攻略(下篇)
uni-app
2501_915106323 小时前
Flutter iOS混淆打包详细教程与步骤
android·flutter·ios·小程序·uni-app·iphone·webview
DK1858383225216 小时前
【源码开源部署】电竞代练护航陪玩小程序:全游戏服务平台完整解决方案(附宝塔部署教程)
游戏·微信小程序·uni-app·开源·php
码云数智-大飞16 小时前
2026 年跨端开发决战:小程序原生 vs uni-app vs Taro 深度对比
小程序·uni-app·taro
BS30813_vx1 天前
基于 Express + uni-app 的养老院管理系统设计与实现
后端·uni-app·express
bug总结1 天前
uniapp 微信小程序请求规范
微信小程序·小程序·uni-app
梦曦i2 天前
unix-router v0.1.0 首发:uni-app x 的 vue-router 风格路由库
前端·uni-app
bug总结3 天前
uniapp 微信小程序分包规范
微信小程序·小程序·uni-app
天府云创3 天前
uni-app X 蒸汽模式发布!性能比肩原生~
前端框架·uni-app·移动开发·原生应用·蒸汽模式·app研发·多端适配