小程序传递多个参数怎么处理

　　小程序开发过程中会遇到页面跳转的情况，在这个过程中就会出现小程序传递多个参数，传递的方式有哪些呢?如果传递数据又会是怎么样呢?以下就会做出解释。

　　一、什么是事件

　　事件是视图层到逻辑层的通讯方式

　　事件可以将用户的行为反馈到逻辑层进行处理

　　事件可以绑定在组件上，当达到触发事件，就会执行逻辑层对应的事件处理函数

　　事件对象可以携带额外信息，如id, dataset, touches

　　事件处理的使用

　　通过在wxml中设置bindtap、catchtap等，在js中写对应的实现方法(不过这种方式目前有个缺点，点击的时候没有点击效果)，使用方法如下

　　以下摘自微信小程序教程，在wxml中绑定一个事件

　　Click me!

　　然后在对应的js中写出事件的具体实现

　　Page({

　　tapName: function(event) {

　　console.log(event)

　　}

　　})

　　事件分类

　　事件分为冒泡事件和非冒泡事件

　　冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递

　　非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节点传递

　　一般的小程序应用场景中，例如一个列表的item中有多个点击事件需要处理，就可以使用catchtap阻止向上冒泡

　　二、参数传递

　　参数传递有两种方式

　　在wxml中使用navigator跳转url传递参数

　　在wxml中绑定事件后，通过data-hi="参数"的方式传递

　　(1)navigator跳转url传递字符串参数

　　代码如下，将要传递到另一个页面的字符串testId的值赋值到url中

　　...

　　在js页面中onLoad方法中接收

　　Page({

　　onLoad: function(options) {

　　var testId = options.testId

　　console.log(testId)

　　}

　　})

　　(2)navigator跳转url传递数组

　　如果一个页面要将一个数组，如相册列表传递到另一个页面

　　...

　　传递到js后从options中得到的是个字符串，每个图片的url通过','分隔，所以此时还需要对其进行处理，重新组装为数组

　　Page({

　　data: {

　　// 相册列表数据

　　albumList: [],

　　},

　　onLoad: function (options) {

　　var that = this;

　　that.setData({

　　albumList: options.albumList.split(",")

　　});

　　}

　　})

　　(3)wxml中配置data-testid传递字符串

　　这种方式一般是在wxml中绑定事件，同时设置需要传递的数据，如果需要传递多个，可以写多个data-[参数]的方式进行传递

　　...

　　在js页面中自定义方法clickMe中接收

　　Page({

　　clickMe: function(event) {

　　var testId = event.currentTarget.dataset.testid;

　　wx.navigateTo({

　　url: '../../pages/test/test'

　　})

　　}

　　})

　　注意：通过wxml设置data-[参数名]传递参数，[参数名]只能是小写，不能有大写

　　(4)wxml中配置data-albumlist传递数组

　　其实原理同上,上代码

　　...

　　在调用小程序js页面中自定义方法clickMe中接收

　　Page({

　　clickMe: function(event) {

　　var albumList = event.currentTarget.dataset.albumlist.split(",");

　　wx.navigateTo({

　　url: '../../pages/test/test'

　　})

　　}

　　})

　　关于事件、小程序传递多个参数，以及传递的方式，上文中都已经做出了详细的说明和介绍，希望这些资料能够帮助你揭开困惑。想要获取更多相关资料请关注微信小程序素材网。

　　微信小程序点击事件处理与参数传递

　　小程序数据传递怎样进行

　　小程序码怎么生成带参数的二维码?