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

微信小程序事件处理和参数传输。什么是事件？送货方式有哪些？如果你传递一个数组呢？对象通过了怎么办？接下来的小系列将讲解微信小程序的事件处理和参数传输。

一.事件

什么是事件

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

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

事件可以绑定到组件，当到达触发事件时，将执行逻辑层对应的事件处理功能

事件对象可以携带附加信息，例如id、数据集、触摸

事件处理的使用

通过设置bindtap、catchtap等。在wxml中，用js编写相应的实现方法(但是这种方法目前有一个缺点，时没有效果)，使用方法如下

以下是微信小程序教程摘录，用wxml绑定一个事件

我！

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

页面({

tapname:函数(事件){

console.log(事件)

}

})

事件分类

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

冒泡事件：当组件上的事件被触发时，该事件将被传递到父节点

非冒泡事件：当组件上的事件被触发时，该事件不会被传递到父节点

在一般使用场景中，例如，如果需要处理的项目列表中有多个单击事件，您可以使用catchtap来防止向上冒泡

二、参数传递

传递参数有两种方式

在wxml中使用导航器跳转url传递参数

在wxml中绑定事件后，它由data-hi=' parameter '传递

(1)导航器跳转url来传递字符串参数

代码如下：将要传递给另一个页面的字符串testid的值赋给url

.

在js页面的onload方法中接收

页面({

onload:函数(选项){

var testid=options.testid

console.log(testid)

}

})

(2)导航器跳转url来传递数组

如果一个页面想要将一个数组(如相册列表)转移到另一个页面，.

传递给js后，你从options得到一个字符串，每张图片的url用'，'隔开，所以这时候需要进行处理，重新组装成一个数组

页面({

数据： {

//相册列表数据

albumlist: []，},

onload:函数(选项){

that=this

that.setdata({

album list : options . album list . split('，')

});

}

})

(3)在3)wxml中配置数据测试传输字符串

这样，事件被绑定在wxml中，同时设置了要传输的数据。如果传输多个数据，可以写入多个数据[参数]进行传输。

.

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

页面({

clickme:函数(事件){

var testid=event . current target . dataset . testid；

wx.navigateto({

url: '././page/test/test '

})

}

})

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

(4)在4)wxml中配置数据列表传输数组

其实原理同上，代码在

.

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

页面({

clickme:函数(事件){

var album list=event . current target . dataset . album list . split('，')；

wx.navigateto({

url: '././page/test/test '

})

}

})

以上是小编为大家整理的关于微信小程序事件处理和参数传递的内容。更多精彩内容，请关注源社网小节目频道。

下面是题目的开头。小程序获取表单内容的步骤是什么？需要什么小程序代码？标题到此结束

小程序获取表单内容的步骤是什么？需要什么小程序代码？亲爱的朋友们，你知道如何通过applet获取表单内容吗？在下面的文章中，小编将详细介绍通过小程序获取表单内容的步骤。

小程序获取表单内容的步骤是什么？

小程序获取表单内容的第一步：

添加from控件并为其指定bindsubmit属性值。

小程序获取表单内容的第二步：

向表单中添加输入控件，并为其指定名称属性值。

通过小程序获取表单内容的第三步：

添加一个按钮控件并为其指定form-type='submit '。

通过小程序获取表单内容的第四步：

在js中取值时使用e.detail.value.xxx或e.detail.value['xxx']，其中xxx为名称属性值。

小程序获取表单内容需要什么微信小程序代码？

获取表单内容的applet代码如下：

页面({

name:函数(e) {//获取输入的值

that=this

that.setdata({

名称： e.detail.value

})

},

id_num:函数(e) {//通过applet输入获取输入值

that=this

that.setdata({

id_num: e.detail.value

})

var id_num=that.data.id_num

if(！(id _ num . length===15 | | id _ num . length===18)){

wx.showtoast({

标题： '请输入15或18位数字身份证号码'，图像： './image/error.png '，工期： 2000

})

}

},

formsubmit:函数(e) {

that=this

var token d=wx . getstoragesync(' token d ')

var name 2=e . detail . value . name 2；//获取输入的初始值

var id _ num 2=e . detail . value . id _ num 2；//获取输入的初始值

var name=that.data.name？that.data.name : name2//三元运算，如果用户不修改信息，直接提交原始信息，如果用户修改信息，将修改后的信息与未修改的信息一起提交。

var id_num=that.data.id_num？that.data.id_num : id_num2

wx.request({

方法： '发布'，url: 'https://.token=' token，//applet接口地址

数据： {

姓名' :姓名，id_num': id_num

},

header : { ' content-type ' : ' application/json ' }，成功：功能(res) {

wx.showtoast({

标题： '数据修改成功'，图像： './image/suess.png '，工期： 2000

})

settimeout(函数{

wx.switchtab({

url: './index/index '，})

}, 2000)

},

fail:功能(res) {

console.log('cuowu' ':' res)

}

})

},

})