当前位置: 首页 > news >正文

[Uniapp]携带参数跳转界面(两种方法)

一、方法1:路由携参

   假设现在有两个界面:界面A和界面B。并要由界面A跳转到界面B,则我们可以使用
                                                                uni.navigateTo({})

  跳转界面时,将参数附加在URL后,并在B界面的onLoad()获取到这个参数

界面A的代码

<script>export default {data() {return {paramPageA: [],  //在A界面中定义的变量,一会要传送给界面B}},methods: {onGo() {uni.request({url: "接口地址",method: "GET",success(res) {this.paramPageA = res.data.data; const paramJson = JSON.stringify(this.paramPageA);//主要看下面这段代码uni.navigateTo({url: '/pages/PageB/PageB?
activityList='+encodeURIComponent(paramJson)                         })//先把A界面要传送的参数转化成JSON形式//然后以encodeURIComponent的形式拼接到URL后方传送//主要看上面这段代码}});}}}
</script>

        界面B的代码

onLoad() {// 从URL参数中获取paramPageA,并解析为JSON对象  const paramPageB = decodeURIComponent(this.$route.query.paramJson);this.paramPageBJSon = JSON.parse(paramPageB);//界面B中定义的参数console.log("接收到的参数", this.paramPageJson);},

二、方法2:依靠全局变量传参

首先在main.js文件中这样定义全局变量

Vue.prototype.$globalData = {  //在此定义所有全局变量allUrl:"http://localhost:8888",   //统一URL地址myToken:null,   //校验token值paramPage:"",   //要传的参数
}

在界面A中这样修改全局变量

this.$globalData.paramPage = res.data.data;

之后在界面B中直接引用即可

相关文章:

  • 【代码随想录】day1 数组
  • springboot读取自定义配置
  • 2024年3月认证通用基础考试问答题及答案
  • Leetcode算法题
  • 低密度奇偶校验码LDPC(七)——SPA和积译码算法的简化
  • week06day01 mysql
  • Spring: spring中SSE的实现方式有哪些
  • 学习java第一天(下载并配置环境+写第一个java程序)
  • (Pytorch框架)神经网络输出维度调试,做出我们自己的网络来!!(详细教程~)
  • Vue2:用node+express写一个轻量级的后端服务
  • 大唐杯学习笔记:Day5
  • Swing程序设计(11)动作事件监听器,焦点事件监听器
  • Docker Compose实战指南:让容器管理变得简单而强大
  • 集成2.5G/5G/10G高速率网络变压器的RJ45网口连接器产品特点介绍
  • 从零开始在kitti数据集上训练yolov5
  • 《微软的软件测试之道》成书始末、出版宣告、补充致谢名单及相关信息
  • AHK 中 = 和 == 等比较运算符的用法
  • java中的hashCode
  • java中具有继承关系的类及其对象初始化顺序
  • JS基础篇--通过JS生成由字母与数字组合的随机字符串
  • Protobuf3语言指南
  • Python 使用 Tornado 框架实现 WebHook 自动部署 Git 项目
  • REST架构的思考
  • 今年的LC3大会没了?
  • 经典排序算法及其 Java 实现
  • 盘点那些不知名却常用的 Git 操作
  • 浅谈Golang中select的用法
  • 如何设计一个微型分布式架构?
  • 适配iPhoneX、iPhoneXs、iPhoneXs Max、iPhoneXr 屏幕尺寸及安全区域
  • 微信如何实现自动跳转到用其他浏览器打开指定页面下载APP
  • 一个JAVA程序员成长之路分享
  • 鱼骨图 - 如何绘制?
  • 阿里云重庆大学大数据训练营落地分享
  • ​​​​​​​​​​​​​​Γ函数
  • #define用法
  • (23)Linux的软硬连接
  • (C语言版)链表(三)——实现双向链表创建、删除、插入、释放内存等简单操作...
  • (LeetCode) T14. Longest Common Prefix
  • (zhuan) 一些RL的文献(及笔记)
  • (二)c52学习之旅-简单了解单片机
  • (附源码)ssm基于jsp的在线点餐系统 毕业设计 111016
  • (附源码)ssm智慧社区管理系统 毕业设计 101635
  • (附源码)计算机毕业设计ssm电影分享网站
  • (每日持续更新)jdk api之FileFilter基础、应用、实战
  • (十八)用JAVA编写MP3解码器——迷你播放器
  • (实战篇)如何缓存数据
  • (转)清华学霸演讲稿:永远不要说你已经尽力了
  • (转)重识new
  • . NET自动找可写目录
  • ../depcomp: line 571: exec: g++: not found
  • .[hudsonL@cock.li].mkp勒索加密数据库完美恢复---惜分飞
  • .NET 4.0中的泛型协变和反变
  • .Net Attribute详解(上)-Attribute本质以及一个简单示例
  • .NET Core日志内容详解,详解不同日志级别的区别和有关日志记录的实用工具和第三方库详解与示例
  • .Net 应用中使用dot trace进行性能诊断