uni-app页面跳转传参的时候,参数是对象该如何传递?

在uni-app中,当需要在页面跳转时传递多个参数,特别是当参数包含在一个对象中时,可以将对象转换为JSON字符串并编码到URL中。此博客展示了如何通过`encodeURIComponent`函数实现这一过程,并在目标页面通过解码获取传递的参数。在跳转页面的`onLoad`生命周期中,利用`decodeURIComponent`解析参数,从而实现参数传递。
摘要由CSDN通过智能技术生成

使用uni-app的时候,页面传递一个或者两三个参数是非常容易做到的,但是有时候需要传递很多参数,这些参数都是都在一个对象里面,我们改如何操作呢?

首先看下需求

uni.navigateTo({ url: '/pages/broadband/broadband})

在跳转这个页面的时候需要把下面的参数传递过去

let infoForm = {
        phone:this.form['客户信息']['办理宽带号码'],
        name:this.form['客户信息']['姓名'],
        city:this.form['客户信息']['详细地址'].address,
        cityCode:this.form['客户信息']['详细地址'].cityCode,
      }

废话不说,直接上实现代码

uni.navigateTo({
        url:
          "/pages/shopInfo/components/addOrEidtPage?item=" +
          encodeURIComponent(encodeURIComponent(JSON.stringify(infoForm))),
      });

实现思路:通过url拼接,将infoForm这个参数对象,在url里面写成item传递,这里借助了encodeURIComponent这个函数,大家不了解这个函数的可以百度一下。接来下我们在跳转过去的页面里面的onload生命周期函数里面打印options就可以看到传递过来的参数了。

let listParam = JSON.parse(decodeURIComponent(decodeURIComponent(option.item)));

        看到这里就点个赞支持一下吧!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值