微信小程序 – 在视图组件上绑定函数并携带参数(事件对象自定义属性传参)

前言

有时候,我们需要在小程序的视图组件上绑定一个函数,而且需要 传递参数

小程序在组件上绑定事件后,传递参数的方式不同于前端开发其他场景中直接加参数的方式,小程序在参数的传递时,采用 事件对象的自定义属性 的方式,具体实现如下:

示例

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

(0)
上一篇 2022年3月22日
下一篇 2022年3月22日

相关推荐