微信小程序 bindtap 事件多参数传递

news2024/12/24 5:12:39

在微信小程序中,我们无法直接通过 bindtap="handleClick(1,2,3)" 的方式传递参数,而是需要通过自定义属性 data- 的方式进行传递,并在事件回调函数中通过 event.currentTarget.dataset 来获取这些参数。然而,这种传参方式不够友好,尤其是在传递多个参数时,需要特别注意参数的形式和命名方式。

微信小程序

代码示例

  • index.wxml
<template name="like">
  <view class="like-line"></view>
  <view class="like-wrap">
    <view class="like {{ item.feedbackType === 1 ? 'selected' : '' }}" bindtap="like" data-args="{{ {item, index, type: 1} }}">
      <!--      👍-->
    </view>
    <view class="dislike {{ item.feedbackType === 2 ? 'selected' : '' }}" bindtap="like" data-args="{{ {item, index, type: 2} }}">
      <!--      👎-->
    </view>
  </view>
</template>
  • index.js
Page({
  async like(e) {
    let { item, type, index } = e.currentTarget.dataset['args']
    let { feedbackType, recordId } = item
    console.log({ type, index, feedbackType, recordId })
    
    // do something
  },
})

注意:

  • 自定义属性命名,不能包含大写字母,大写会自动转成小写,可能会导致获取不到参数。如 data-recordId 会自动转成 data-recordid
  • 如果使用 data-record-id 的形式,最终在 event.target.dataset 中会将 - 转成驼峰的形式,即 recordId,取值需要用 event.target.dataset['recordId']

欢迎访问:天问博客

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1302255.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【FPGA】数字电路设计基础

数字电路基础 1 什么是数字电路 在学习数字电路之前&#xff0c;我们先要了解下什么是数字电路。想要搞明白数字电路&#xff0c;就要搞明白生活中有 两种概念&#xff0c; 数字信号和模拟信号&#xff0c;模拟信号一般包括压力、气温、速度等信号&#xff0c;模拟量的值是可…

4s店3D虚拟云展厅让看车变得更加便捷和高效

汽车企业7203D虚拟全景展示的特点和优势主要体现在以下几个方面&#xff1a; 逼真的观赏和试乘体验&#xff1a;7203D虚拟全景展示利用虚拟现实技术&#xff0c;提供了高度逼真的汽车观赏和试乘体验。消费者可以在虚拟环境中更加深入地了解汽车的外观、内饰和功能特点&#xff…

【mysql-5.7.26-1.el7.x86_64.rpm-bundle.tar安装】linux安装mysql5.7

之前安装的时候遇到了很多问题&#xff0c;浪费了一些时间。整理出这份教程&#xff0c;照着做基本一遍过。 这是安装包: 链接&#xff1a;https://pan.baidu.com/s/1gBuQBjA4R5qRYZKPKN3uXw?pwd1nuz 1.下载安装包&#xff0c;上传到linux。我这里就放到downloads目录下面…

阻抗控制下机器人接触刚性环境振荡不稳定进行阻抗调节

在阻抗控制下&#xff0c;当机器人接触刚性环境时&#xff0c;可能会出现振荡不稳定的情况。这可以通过调整机器人的阻抗参数来进行调节。 阻抗接触 阻抗参数中的质量、阻尼和刚度都会对机器人控制系统的性能和稳定性产生重要影响。质量主要影响系统的惯性&#xff0c;从而影响…

【网络安全】CTF入门教程(非常详细)从零基础入门到进阶,看这一篇就够了!

一、CTF简介 CTF&#xff08;Capture The Flag&#xff09;中文一般译作夺旗赛&#xff0c;在网络安全领域中指的是网络安全技术人员之间进行技术竞技的一种比赛形式。CTF起源于1996年DEFCON全球黑客大会&#xff0c;以代替之前黑客们通过互相发起真实攻击进行技术比拼的方式。…

ELK综合案例

综合案例 ELKfilebeatnginxjson nginx配置 1,在nginx服务器上安装nginx # yum install epel-release # yum install nginx 2,将nginx日志改成json格式,这样各个字段就方便最终在kibana进行画图统计了 # vim /etc/nginx/nginx.conf ​ http {log_format main $remote_ad…

Rust 学习

Rust 官网&#xff1a;https://www.rust-lang.org/zh-CN/ 1、Rust 简介 Rust 是一门注重安全&#xff08;safety&#xff09;、速度&#xff08;speed&#xff09;和并发&#xff08;concurrency&#xff09;的现代系统编程语言。Rust 通过内存安全来实现以上目标&#xff0c;但…

Faster R-CNN pytorch源码血细胞检测实战(二)数据增强

Faster R-CNN pytorch源码血细胞检测实战&#xff08;二&#xff09;数据增强 文章目录 Faster R-CNN pytorch源码血细胞检测实战&#xff08;二&#xff09;数据增强1. 资源&参考2. 数据增强2.1 代码运行2.2 文件存放 3 数据集划分4. 训练&测试5. 总结 1. 资源&参…

kafka windows版本的下载安装,并且本地使用(亲测有效)

目录 1 问题2 下载 1 问题 本地启动一个kafka &#xff0c;然后可以实现生产者 消费者 2 下载 https://downloads.apache.org/kafka/ 选择一个版本下载 下载之后解压 修改配置 修改好之后&#xff0c;就保存&#xff0c;之后先启动zookper &#xff0c;之后再启动 ka…

Mybatis-Plus 3.3.2 发布,新增优雅的数据安全保护姿势[MyBatis-Plus系列]

Hi,大家好,我是悟纤。过着爱谁谁的生活,活出不设限的人生。 存在数据库中的数据对于普通用户而言是不可见的,好像是藏起来了一样,但对于开发者,只要知道数据库的连接地址、用户名、密码,则数据不再安全;这也意味着,一旦连接数据库的配置文件暴露出去,则数据不再安全…

聚焦中国—东盟大健康产业峰会 点靓广西“长寿福地”品牌

12月8-10日2023中国—东盟大健康产业峰会暨大健康产业博览会在南宁国际会展中心成功举办&#xff0c;本次峰会由国家中医药管理局、广西壮族自治区人民政府联合主办&#xff0c;中国老年学和老年医学学会、自治区党委宣传部、自治区民政厅、广西壮族自治区外事办公室、广西壮族…

SQL窗口函数OVER用法整理

文章目录 SQL窗口函数OVER用法整理 SQL窗口函数OVER用法整理 OVER的定义 OVER用于为行定义一个窗口&#xff0c;它对一组值进行操作&#xff0c;不需要使用GROUP BY子句对数据进行分组&#xff0c;能够在同一行中同时返回基础行的列和聚合列。 语法 OVER ( [ PARTITION BY c…

核心大表7亿数据,查询性能快40倍!科大讯飞HTAP探索实践

科大讯飞在 2021 年关注原生分布式数据库&#xff0c;并于 2023 年 7 月在核心业务落地 OceanBase&#xff0c;实现了业务稳定运行、灵活扩缩容&#xff0c;以及一套系统处理 TP 和 AP 业务且互不影响。并带来了意外收获&#xff0c;即存储成本下降 50%、运维复杂度极大简化。科…

五年制专转本备考冲刺阶段,老师给你六点建议助你上岸

1、热衷的不是学习&#xff0c;而是思考 人与人之间最大的差别在于思维的差别&#xff0c;也可以说是思考的差别。专转本也是如此&#xff0c;有人思考得简单&#xff0c;有人思考得复杂&#xff1b;有人想得全面&#xff0c;有人想得肤浅。 只有善于思考&#xff0c;才会对问…

Springboot管理系统数据权限过滤——ruoyi实现方案

本文主要简述&#xff0c;Ruoyi框架使用的权限过滤实现方案&#xff0c;实现简单易懂。主要知识点有&#xff1a; 注解定义&#xff1b;面向切面编程&#xff0c;在执行有数据权限注解的方法之前获取用户组织权限&#xff0c;拼接到domain对象的params参数中&#xff1b; 1. …

函数的栈帧

我们每次在调用函数的时候&#xff0c;都说会进行传参。每次创建函数&#xff0c;或者进行递归的时候&#xff0c;也会说会进行压栈。 那么&#xff0c;今天我们就来具体看看函数到底是如何进行压栈&#xff0c;传参的操作。 什么是栈&#xff1f; 首先我们要知道&#xff0c;…

Python (五) 处理图像

程序员的公众号&#xff1a;源1024&#xff0c;获取更多资料&#xff0c;无加密无套路&#xff01; 最近整理了一波电子书籍资料&#xff0c;包含《Effective Java中文版 第2版》《深入JAVA虚拟机》&#xff0c;《重构改善既有代码设计》&#xff0c;《MySQL高性能-第3版》&…

深度学习(生成式模型)——ADM:Diffusion Models Beat GANs on Image Synthesis

文章目录 前言基础模型结构UNet结构Timestep Embedding关于为什么需要timestep embedding global attention layer 如何提升diffusion model生成图像的质量Classifier guidance实验结果 前言 在前几篇博文中&#xff0c;我们已经介绍了DDPM、DDIM、Classifier guidance等相关的…

【Scala】Scala中的一些基本数据类型的特性 列表、元组、构造器、单例对象、伴生类、伴生对象、抽象类与特质

列表 使用List(“”,“”,“”)去声明 sliding 和 groued表示迭代器 val iter List("Hadoop", "Spark", "Scala") sliding 2// sliding 和 groued 是有区别的while (iter.hasNext){println(iter.next())}for (elem <- iter){println(elem)}…

11 月 NFT 动态:交易量增长,Layer 2 格局剧变

作者&#xff1a;stellafootprint.network 11 月份&#xff0c;随着比特币和以太坊价格的提升&#xff0c;加密货币市场活动频繁&#xff0c;市场呈现进一步复苏的迹象。NFT 领域中&#xff0c;Blur 的交易量飙升&#xff0c;进一步巩固地位&#xff1b;Blast 的亮相&#xff…