微信小程序页面传参(多条数据的传递)

简介: 本文介绍了微信小程序中页面间参数传递的方法。1) 单个数据传递:通过`wx.navigateTo`将ID拼接在URL中传递,接收页面在`onLoad`中获取。2) 多个参数传递:将数据转换为JSON字符串,然后通过URL参数传递,接收页面同样在`onLoad`中解析JSON恢复数据。3) 提到了JSON作为数据交换格式的基础知识。全文鼓励读者尝试并点赞。

微信小程序页面传参(多条数据的传递)

1.单个数据的传参
image.png

传递页面

//去商品详情页
goDetail(e){
   
   
  let id=e.currentTarget.dataset.item._id
  console.log("单个参数的传递",id)
  wx.navigateTo({
   
   
    url: '/pages/shop_detail/shop_detail?id='+id,
  })
},

接受页面

 onLoad (e) {
   
   
  console.log('接受到传送的单个参数',e)
}

2.多个参数的传递
image.png

代码(要传递参数的页面)

 getpass: function(e) {
   
   
    let id = e.currentTarget.dataset.id;
    let number=this.data.list[id]
    let strr = JSON.stringify(number);
    console.log("多个参数的传递",number)
    wx.navigateTo({
   
   
      url: '/pages/payfor/payfor?jsonStr=' + strr ,
    })
  },

接受页面的代码

onLoad: function(options) {
   
   
    let that = this
    // console.log(options)
    //  console.log(options.jsonStr)
    //  console.log(options.strr)
    let item = JSON.parse(options.jsonStr)
    console.log('上个页面跳转的参数', item)
    wx.setStorageSync('address', item)
    let address=wx.getStorageSync('address')
    console.log(address.name)
    that.setData({
   
   
      address:item
    })
  },

3.Json
Json即JavaScript Object notation,是一种基于文本,独立于语言的轻文本交换格式,易于人的阅读和编写,也易于机器的解析和生成。有两种结构,对象格式和数组格式

好了,今天的分享就到这里了。点个赞吧
在这里插入图片描述

目录
相关文章
|
3月前
|
存储 安全 小程序
在微信小程序中使用 Vant 时如何确保数据的安全?
在微信小程序中使用 Vant 时如何确保数据的安全?
50 1
|
3月前
|
JSON 小程序 前端开发
微信小程序的目录结构及页面结构的说明
本文详细介绍了微信小程序的目录结构、页面组成部分以及项目的全局配置文件,阐述了小程序的宿主环境和运行机制,包括小程序启动和页面渲染的过程。
微信小程序的目录结构及页面结构的说明
|
2月前
|
小程序 JavaScript 开发工具
|
2月前
|
缓存 小程序 UED
如何利用小程序的生命周期函数实现数据的加载和更新?
如何利用小程序的生命周期函数实现数据的加载和更新?
80 4
|
2月前
|
移动开发 小程序 数据可视化
微信小程序可视化开发工具之动态数据
微信小程序可视化开发工具之动态数据
46 3
|
3月前
|
小程序 JavaScript API
微信小程序开发学习之页面导航(声明式导航和编程式导航)
这篇文章介绍了微信小程序中页面导航的两种方式:声明式导航和编程式导航,包括如何导航到tabBar页面、非tabBar页面、后退导航,以及如何在导航过程中传递参数和获取传递的参数。
微信小程序开发学习之页面导航(声明式导航和编程式导航)
|
3月前
|
小程序 开发者
微信小程序之网络数据请求 wx:request的简单使用
这篇文章介绍了微信小程序中如何使用wx.request进行网络数据请求,包括请求的配置、请求的格式以及如何在开发阶段关闭请求的合法检验。
微信小程序之网络数据请求 wx:request的简单使用
|
3月前
|
小程序 JavaScript 开发工具
微信小程序——全局数据共享
微信小程序——全局数据共享
|
3月前
详细教程:扫码提交表单后,数据直接推送到企业微信、钉钉、飞书群聊
在草料制作的表单中,填表人扫码填写并提交数据后,这些信息可以立即通过企业微信、钉钉或飞书自动推送到相应的群聊中,实现即时共享和沟通,提升团队协作效率。
|
3月前
|
JSON 小程序 JavaScript
微信小程序页面事件,下拉刷新事件和上拉触底事件
这篇文章介绍了微信小程序中如何实现下拉刷新和上拉触底事件,包括开启下拉刷新、配置下拉刷新样式、监听下拉刷新事件,以及监听上拉触底事件和配置上拉触底的距离。