小程序进行事件传参的时候,除了使用 data-*属性 传递参数外,还可以 使用 mark 标记传递参数
mark 是一种自定义属性,可以在组件上添加,用于来识别具体触发事件的 target 节点。同时 mark 还可以用于承载一些自定义数据
在组件上使用 mark:自定义属性 的方式将数据传递给事件处理函数
例如: <view mark:id=“100" bindtap="handler" />
然后通过事件对象进行获取自定义数据
可按照以下代码复制尝试:
<!--pages/cart/cart.wxml-->
<view bindtap="parentHandler" mark:parentid="1" mark:parentname="tom">
<!-- 如果需要使用 mark 进行事件穿参数,需要使用 mark: 自定义属性的方式进行参数传递 --><!-- <button bindtap="btnHandler" mark:id="1" mark:name="tom">按钮</button> --><button mark:id="1" mark:name="tom">按钮</button>
</view>
// pages/cart/cart.js
Page({// 按钮绑定的事件处理函数btnHandler (e) {console.log(e.mark.id)console.log(e.mark.name)},parentHandler (e) {// 先点击蓝色区域(不点击按钮)// 通过事件对象获取的是 view 身上绑定的数据// 先点击按钮(不点击蓝色区域)// 通过事件对象获取到的是触发事件的节点 以及 父节点身上所有的 mark 数据console.log(e)}})
/* pages/cart/cart.wxss */view {display: flex;height: 300rpx;background-color: rgb(231, 116, 22);align-items: center;
}