微信小程序 - 在视图组件上绑定函数并携带参数(事件对象自定义属性传参)
程序员文章站
2022-03-14 20:09:02
前言有时候,我们需要在小程序的视图组件上绑定一个函数,而且需要 传递参数。小程序在组件上绑定事件后,传递参数的方式不同于前端开发其他场景中直接加参数的方式,小程序在参数的传递时,采用 事件对象的自定义属性 的方式,具体实现如下:示例WXML:data-flag:即为绑定在事件对象上的属性。...
前言
有时候,我们需要在小程序的视图组件上绑定一个函数,而且需要 传递参数
。
小程序在组件上绑定事件后,传递参数的方式不同于前端开发其他场景中直接加参数的方式,小程序在参数的传递时,采用 事件对象的自定义属性
的方式,具体实现如下:
示例
WXML:
<!-- 点击事件(带data数据 参数) -->
<button bindtap="test" data-flag="{{ flag }}">按钮</button>
- data-flag:即为绑定在事件对象上的属性(可自定义:data - *),注意获取时的名称。
- {{ flag }}:即为自身 data 身上的数据
JavaScript:
Page({
/**
* 页面的初始数据
*/
data: {
flag: '参数'
},
/**
* 页面的初始数据
*/
test: function(e) {//e为参数
// 参数(从事件对象上依次 点(.) 到我们绑定的属性)
let data = e.currentTarget.dataset.flag
// 测试打印
console.log(data)//参数
}
})
这样参数就传过来了。
本文地址:https://blog.csdn.net/weixin_44198965/article/details/107591993