阿里云开发者社区

电脑版
提示:原网页已由神马搜索转码, 内容由developer.aliyun.com提供.

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

2024-05-26752
版权
版权声明:
本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写 侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。
简介:本文介绍了微信小程序中页面间参数传递的方法。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,是一种基于文本,独立于语言的轻文本交换格式,易于人的阅读和编写,也易于机器的解析和生成。有两种结构,对象格式和数组格式

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

目录
相关文章
|
10天前
|
JSON安全定位技术
微信附近人提取v3脚本, 微信附近人id提取技术插件,采集附近人wxid数据工具
本内容介绍微信“附近的人”功能的技术原理与实现方法,基于LBS服务,涉及位置模拟、协议分析及数据解析。通过修改GPS坐标或使用Frida等工具hook位置函数
|
10月前
|
存储安全小程序
在微信小程序中使用 Vant 时如何确保数据的安全?
在微信小程序中使用 Vant 时如何确保数据的安全?
11111
|
5月前
|
缓存小程序API
微信小程序页面导航与路由:实现多页面跳转与数据传递
本文深入探讨微信小程序的页面导航与路由机制,介绍多种页面跳转方式如`wx.navigateTo`、`wx.redirectTo`、`wx.switchTab`等,并讲解通过URL、全局变量和事件传递数据的方法。结合案例实现多页面跳转与数据传递,帮助开发者掌握这一重要技能。
|
5月前
|
缓存小程序API
微信小程序网络请求与API调用:实现数据交互
本文深入探讨了微信小程序的网络请求与API调用,涵盖`wx.request`的基本用法、常见场景(如获取数据、提交表单、上传和下载文件)及注意事项(如域名配置、HTTPS协议、超时设置和并发限制)。通过一个简单案例,演示了如何实现小程序与服务器的数据交互。掌握这些技能将帮助你构建功能更丰富的应用。
|
9月前
|
小程序JavaScript开发工具
微信小程序——全局数据共享
【10月更文挑战第5天】
|
9月前
|
缓存小程序UED
如何利用小程序的生命周期函数实现数据的加载和更新?
如何利用小程序的生命周期函数实现数据的加载和更新?
22545
|
9月前
|
移动开发小程序数据可视化
微信小程序可视化开发工具之动态数据
微信小程序可视化开发工具之动态数据
14333
|
10月前
|
小程序JavaScriptAPI
微信小程序开发学习之页面导航(声明式导航和编程式导航)
这篇文章介绍了微信小程序中页面导航的两种方式:声明式导航和编程式导航,包括如何导航到tabBar页面、非tabBar页面、后退导航,以及如何在导航过程中传递参数和获取传递的参数。
微信小程序开发学习之页面导航(声明式导航和编程式导航)
|
10月前
|
JSON小程序JavaScript
微信小程序页面事件,下拉刷新事件和上拉触底事件
这篇文章介绍了微信小程序中如何实现下拉刷新和上拉触底事件,包括开启下拉刷新、配置下拉刷新样式、监听下拉刷新事件,以及监听上拉触底事件和配置上拉触底的距离。
|
3月前
|
小程序Java关系型数据库
weixin163基于微信小程序的校园二手交易平台系统设计与开发ssm(文档+源码)_kaic
本文介绍了一款基于微信小程序的校园二手物品交易平台的开发与实现。该平台采用Java语言开发服务端,使用MySQL数据库进行数据存储,前端以微信小程序为载体,支持管理员和学生两种角色操作。管理员可管理用户、商品分类及信息、交易记录等,而学生则能注册登录、发布购买商品、参与交流论坛等。系统设计注重交互性和安全性,通过SSM框架优化开发流程,确保高效稳定运行,满足用户便捷交易的需求,推动校园资源共享与循环利用。

热门文章

最新文章

  • 1
    入职必会-开发环境搭建31-微信开发者工具下载和安装
    274
  • 2
    微信小程序面试题来了
    163
  • 3
    【微信小程序开发实战项目】——个人中心页面的制作
    650
  • 4
    【微信小程序开发实战项目】——如何制作一个属于自己的花店微信小程序(3)
    296
  • 5
    尝试使用阿里云服务器搭建微信小程序
    300
  • 6
    基于微信小程序餐厅点餐系统设计与实现(源码+lw+部署文档+讲解等)
    1106
  • 7
    基于微信小程序便捷记账系统设计与实现(源码+lw+部署文档+讲解等)
    324
  • 8
    基于SpringBoot+Vue的宠物医院微信小程序的详细设计和实现(源码+lw+部署文档+讲解等)
    173
  • 9
    基于SpringBoot+Vue+uniapp的宠物医院微信小程序的详细设计和实现(源码+lw+部署文档+讲解等)
    179
  • 10
    基于SpringBoot+Vue+uniapp的传统戏曲推广微信小程序的详细设计和实现(源码+lw+部署文档+讲解等)
    158