初学小程序，for循环点击带参

最新推荐文章于 2024-05-09 14:01:17 发布
最新推荐文章于 2024-05-09 14:01:17 发布
阅读量730 收藏 1
点赞数
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/C_xran/article/details/129819118
版权

wx:for对data数据遍历生成多个容器，点击每个容器跳转对应的url

刚开始直接用bindtap带参不成功，看文档明白了，因为小程序不允许事件名后直接带参数，，所以使用 ‘data-自定义名称‘来传参 

wxml中使用wx:for循环，再使用bindtap添加点击事件，data-url来加入js中data数据

js

bindtap点击事件，e.currentTarget.dataset则是点击时需要传的参数

 打印结果

 

 记录一下~

C_xran
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序wx:for的使用，动态传参
03-29
作者：萌神哆啦A梦，来自原文地址   一：wx:for的使用 在小程序的开发过程中，经常会用到在前端页面循环打印一个数组或者对象的数据，这样的话就需要用wx：for来实现。 一般情况下，小程序的utils这个文件夹下，我们可以把本地的数据写进去，封装成.js文件，提供对外暴露的接口，然后读取本地数据，这些在上一篇博客中有详细介绍。我们最后说到写好的本地数据可以另一个页面读取：   var fileData = require('../../utils/data.js') Page({ data: { showData: fileData.mtData().list, }, }) 在data{}
微信小程序事件传参
闪电⚡之王的博客简介
09-04 4032
事件对象 ===》目标对象 ===》dataset对象 ===》参数
微信小程序项目总结：for循环，绑定点击事件，二维数组列表渲染_小程序wx for二维数组
2401_84411557的博客
05-09 417
为了帮助大家更好的了解前端，特别整理了《前端工程师面试手册》电子稿文件。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】"title" : "第一个标题","content":"第一个内容"},"title" : "第二个标题","content":"第二个内容"},"title" : "第三个标题","content":"第三个内容"}需要触发readDetail事件时，取到对应的id调接口查看详情。可是小程序又不允许事件名后直接注入id参数。
微信小程序中使用wx:for，循环中绑定点击事件，对数组进行渲染
qq_42853710的博客
03-25 5835
微信小程序实际开发中，在for循环中，需要获取用户对那组数据进行了修改，使用了vue太久，微信小程序有点忘记了，查阅资料后也是很快熟悉起来，但是赋值过程中遇到了一些小问题，解决了，特此记录一下。 1、在for循环中使用switch开关，用户点击对应开关，需要将对应数组中checked改变状态 <switch style="zoom:.8;margin:30rpx 0 0 20rpx;" type="switch" checked="{{item.checked}}" bindchange="list
微信小程序项目总结：for循环，绑定点击事件，二维数组列表渲染
IT博客技术分享
01-18 6311
一：for循环，绑定点击事件 分享者：niedongdong，原文地址 最近公司有小程序的项目，本人有幸参与其中，一个项目做下来感觉受益匪浅，与大家做下分享，欢迎沟通交流互相学习。 先说一下此次项目本人体会较深的几个关键点：微信地图、用户静默授权、用户弹窗授权、微信充值等等。 言归正传，今天分享我遇到的关于wx:for循环绑定数据的一个tips： 想...
微信小程序for循环，点击传递参数
Haines
07-15 2255
解决办法：通过设置data-key曲线救国 代码： html <scroll-view style="height: 1000rpx;" scroll-y="true" wx:if="{{committeeUnSelectedFlag}}"> <view class="committee-list"> <view class="committee-item" wx:for="{{committeeLi
初学者好玩儿的小程序
12-04
"初学者好玩儿的小程序"这个主题就是一个极好的起点，它涵盖了C++编程语言，一个广泛应用于系统软件、游戏开发、应用程序等多个领域的强大工具。本文将深入探讨C++小程序的相关知识点，帮助初学者在实践中学习和成长...
微信小程序期末大作业，体育新闻小程序，适合初学者学习使用
05-15
本项目是一个基于微信小程序的体育新闻阅读平台，非常适合初学者入门学习。 首先，我们要了解微信小程序的基本结构。一个小程序通常包含以下部分： 1. `app.js`：全局配置文件，用于定义小程序的启动逻辑，设置...
微信小程序表格合并demo
11-21
微信小程序是一种轻量级的应用开发框架，由腾讯公司推出，主要应用于移动端，提供了一套基于JavaScript和WXML（微信小程序标记语言）的开发环境。在这个“微信小程序表格合并demo”中，我们可以学习到如何在微信小...
适合初学者的一个经典的php小程序
04-14
标题中的“适合初学者的一个经典的php小程序”表明这是一个面向初学者的PHP编程示例，旨在帮助他们理解PHP语言的基础和如何构建小型应用程序。PHP（Hypertext Preprocessor）是一种广泛使用的开源脚本语言，尤其适合...
C++ 掷骰子小程序（源码）
最新发布
05-19
**C++ 掷骰子小程序知识点详解** 在C++编程中，实现一个掷骰子游戏是一个常见的练习，它可以帮助初学者掌握基本的控制流程、函数使用以及随机数生成。本程序正是这样一个实例，通过它我们可以深入理解以下几个核心...
微信小程序之循环与事件冒泡
suzhiwei_boke的博客
08-05 806
事件冒泡：在一个对象上触发某类事件，这个事件会向这个对象的的父级传播，从里到外，直至它被处理或者到达了对象层次的最顶层，即document对象。这个过程就是JavaScript的事件冒泡。 事件冒泡的作用： （1）事件冒泡允许多个操作被集中处理，（把事件处理器添加到一个父级元素上，避免把事件处理器添加到多个子元素上），它还可以让你在对象层的不同级别捕获事件。 bindtap 普通点击属性 catchtap 执行事件冒泡 event.stopPropagation(); 循环：wx:for="{{d
微信小程序wx:for循环获取点击的第几个列表
m0_54585610的博客
11-20 1210
注：data-index="{{index}}" 必须在绑定 bindtap 点击事件的 view 才能生效。在 wx:for 循环中添加 data-index="{{index}}"带参数跳转采购详情页面
JS中使用for循环添加点击事件时，获取i值及参数异常原因及解决办法
大头之家
01-24 4767
遇见此问题,代码检查了n次都没毛病,但是却出现下述问题, 坑了我好久,原来是这个原因,记录避坑! PS这是js的处理方法, 在jquery中直接用each遍历元素绑定点击事件即可避免 $('#id').each(function(i){ $(this).click(function(){  alert(i); }); }); 转自 : https://
#微信小程序#wx:for循环时点击其中某个子组件如何获取它的下标？
weixin_43811390的博客
12-11 4700
问题描述：在小程序中写一个循环组件，需要实现这个功能：点击其中某个子组件，就把这个组件从这个数组中删除，但是不知道点击事件中返回e如何加入代表该子组件下标的信息。 wx:for用到的是一个普通数组[a,b,c]，不想要写一个对象数组，给每一个元素一个序号属性[{value:“a”, id:“0”}, {value:“b”, id:“1”}, {value:“c”, id:“2”}]，而是直接获取它的下标。 解决方法： <block wx:for="{{photoList}}" wx:f
wx：for的使用和事件传参，解构赋值的应用
qq_44821064的博客
08-26 313
在页面的.js文件中创建了一个对象，并且在页面的view中调用了两种不同的方法将对象中的元素显示出来！第2种代码要加强理解！！！小程序中的wx:if wx:elif wx:else 其实好像c语言中的 if-elif-else在页面的.js文件中 创建了一个hotel数组，里面包含了酒店的图片和名字！{{index}}是显示标号，{{item.name}}显示的是对象中的name属性！问题1： index,item总是这两个英文吗？其实是可以改变的,如下图。
js for循环给点击事件传参i
breakCSDN的博客
11-21 893
想法：想将外面的i传到onclick事件中去 一开始的错误做法： <script type="text/javascript"> //得到class为a的标签list数组 var zujian = document.getElementsByClassName("a"); //遍历 for (var i = 0 ; i < zujian.length ; i++) { alert(i); //zujian[i].onclick = function(i){
【微信小程序】事件传参问题
汪小穆的博客
11-06 1735
前言：微信小程序跟vue.js有很多相似点，也有很多不同点。例如在事件传值上就有很大区别。
wx:for与wx:key和data-连用，解决多个二维数组共同传参的问题
十一侍卫的博客
07-12 478
我用的是两个二维数组，举例为month和monthWork。其中每一个数组里面都是每七个成一个数组,数组中每个元素还是个字典，简单拿month举个例子： month[[{a:1,b:2,c:3},{a:2,b:3,c:4},{a:3,b:4,c:5}...], [{a:1,b:2,c:3},{a:2,b:3,c:4},{a:3,b:4,c:5}...],...]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值