小程序获取节点绑定数据data-index的方法

2024-04-17 08:34:58

1.微信小程序dataset undefined ？？

2.如何获取数组index索引？

3.获取节点的属性，width ,height,left,right等等

方法一（一般用这个获取数据,记得要bindtap点击执行这个函数才能获取到currentTarget.dataset）：

wxml:

<view data-id="{{1}}" data-haha="{{index}}" bindtap="a" id="aabb">点击获取data-id绑定的id值</view>

js:

a:function(event){

console.log(event) //打印出view中所有属性的值，包括“点击获取data-id绑定的id值”

console.log(event.currentTarget.dataset.id) //打印出data-id绑定的id值

console.log(event.currentTarget.dataset.haha) //打印出index的值

console.log(event.currentTarget.id) //打印出aabb

}

方法二：

wxml:

<view data-id="{{1}}" data-haha="{{index}}" bindtap="a" id="aabb">点击获取data-id绑定的id值</view>

js:

a:function(){

wx.createSelectorQuery().select('#eee').boundingClientRect(function (rect) {
console.log(rect.dataset.id) // 打印节点的dataset中的id值，即data-id绑定的值

rect.id // 节点的ID
rect.dataset // 节点的dataset
rect.left // 节点的左边界坐标
rect.right // 节点的右边界坐标
rect.top // 节点的上边界坐标
rect.bottom // 节点的下边界坐标
rect.width // 节点的宽度
rect.height // 节点的高度
}).exec()

}

官方微信开发文档新方法说明地址：https://developers.weixin.qq.com/miniprogram/dev/api/NodesRef.boundingClientRect.html

或者：

https://developers.weixin.qq.com/miniprogram/dev/api/wxml-nodes-info.html?search-key=wxml%E8%8A%82%E7%82%B9

小程序获取节点绑定数据data-index的方法相关推荐

微信小程序获取微信运动数据并解密
官方API 官方API 步骤 1,APP端拉起微信小程序 2,小程序端获取微信运动数据 3,后台解密获取的微信运动数据实现 1,APP端调起微信小程序准备工作: 1)微信开放平台,微信公众平台注册 ...
最新小程序获取个人信息头像名称openid等方法
最新小程序获取个人信息头像名称openid等方法一.利用标签显示头像和用户名(用于展示微信开放的数据) <open-data type="userNickName"> ...
微信小程序获取Onenet温湿度数据并控制灯亮灭
其实之前就写过类似的文章,但是看过我博客的朋友就知道,我是先写微信小程序获取onenet,然后再写esp32上云到onenet.一篇是ESP32-C3通过MQTT协议把温湿度上传到OneNet平台 ...
ESP32-微信小程序获取OneNET温湿度数据
查询OneNet平台多协议接入文档,地址链接如下,这里直接查看MQTT的API使用方法: https://open.iot.10086.cn/doc/v5/develop/detail/582 新版M ...
微信小程序获取用户绑定手机号码完整版（转载）
一.准备阶段创建小程序项目(测试号即可) 创建Java后台项目(此处为SpringBoot 普通项目) 二.前端代码 WXML 代码  <view ...
微信小程序获取微信绑定授权手机号getPhoneNumber 全流程及出现手机号带*号问题详解
微信小程序文档中给出如下示例获取微信用户绑定的手机号,需先调用login接口. 因为需要用户主动触发才能发起获取手机号接口,所以该功能不由 API 来调用,需用 <button> 组件的 ...
微信小程序获取数据库的数据返回空数组
在接触微信小程序的时候,请求数据库时返回了空数组,只要打开云开发控制台,在数据库里点击的你的集合,设置一下你的权限管理为-所有用户可读,仅创建者可读写,就行了
php实现微信小程序获取用户openid，昵称和头像方法
最近做微信小程序,要做一个排行榜的功能,摸索了一天,终于找到获取用户openid,昵称和头像方法. 先上wxml: <button bindtap="getInfo"> ...
微信小程序获取微信绑定授权手机号
方法: 1.使用<button>组件,并将该组件的open-type的属性值设置为getPhoneNumber,绑定bindgetphonenumber事件 2.当用户点击允许时,可以通过 ...

最新文章

热门文章