当前位置:网站首页>小程序事件绑定
小程序事件绑定
2022-07-05 20:19:00 【'wx】
1.什么是事件
事件是渲染层到逻辑层的通讯方式。通过事件可以将用户在渲染层产生的行为,反馈到逻辑层进行业务的处理

2.小程序常用事件
类型 | 绑定方式 | 事件描述 |
tap | bindtap 或 bind:tap | 手指触摸后马上离开,类似于 HTML 中的 click 事件 |
input | bindinput 或 bind:input | 文本框的输入事件 |
change | bindchange 或 bind:change | 状态改变时触发 |
3.事件对象的属性列表
当事件回调触发的时候,会收到一个事件对象event,它的详细属性如下
属性 | 类型 | 说明 |
type | String | 事件类型 |
timeStamp | Integer | 页面打开到触发事件所经过的毫秒数 |
target | Object | 触发事件的组件的一些属性值集合 |
currentTarget | Object | 当前组件的一些属性值集合 |
detail | Object | 额外的信息 |
touches | Array | 触摸事件,当前停留在屏幕中的触摸点信息的数组 |
changedTouches | Array | 触摸事件,当前变化的触摸点信息的数组 |
4.target和currentTarget的区别
target 是触发该事件的源头组件,而 currentTarget 则是当前事件所绑定的组件
5.bindtap语法格式
通过bindtap为组件绑定tap触摸事件
<button bindtap="btnGet">发起get请求</button>在页面的.js文件中定义对应的事件处理函数,时间参数通过形参event(一般简写成e)来接受:
btnGet() {
wx.request({
url: 'https://applet-base-api-t.itheima.net/api/get',
method: 'GET',
data: {
name: 'xiaoming',
age: 12
},
success: (res) => {
console.log(res.data)
}
})
},6.在事件处理函数中为data中的数据赋值
this.setData({
canIUseGetUserProfile: true
})7.事件传参
通过组件提供的data-*自定义属性传参,*代表的是参数的名字

边栏推荐
- Elk distributed log analysis system deployment (Huawei cloud)
- Guidelines for application of Shenzhen green and low carbon industry support plan in 2023
- 如何形成规范的接口文档
- Model method
- Go language | 01 wsl+vscode environment construction pit avoidance Guide
- 无卷积骨干网络:金字塔Transformer,提升目标检测/分割等任务精度(附源代码)...
- Oracle-表空间管理
- ICTCLAS用的字Lucene4.9捆绑
- leetcode刷题:二叉树18(最大二叉树)
- [C language] merge sort
猜你喜欢

【数字IC验证快速入门】6、Questasim 快速上手使用(以全加器设计与验证为例)

leetcode刷题:二叉树17(从中序与后序遍历序列构造二叉树)

港股将迎“最牛十元店“,名创优品能借IPO突围?

【数字IC验证快速入门】7、验证岗位中必备的数字电路基础知识(含常见面试题)

Oracle tablespace management

Guidelines for application of Shenzhen green and low carbon industry support plan in 2023

【数字IC验证快速入门】8、数字IC中的典型电路及其对应的Verilog描述方法

A solution to PHP's inability to convert strings into JSON

Go language | 03 array, pointer, slice usage

Solve the problem that the database configuration information under the ThinkPHP framework application directory is still connected by default after modification
随机推荐
Rainbond 5.7.1 支持对接多家公有云和集群异常报警
1: Citation;
Wechat applet regular expression extraction link
CCPC 2021威海 - G. Shinyruo and KFC(组合数,小技巧)
关于BRAM IP复位的优先级
无卷积骨干网络:金字塔Transformer,提升目标检测/分割等任务精度(附源代码)...
A solution to PHP's inability to convert strings into JSON
Informatics Olympiad 1338: [example 3-3] hospital setting | Luogu p1364 hospital setting
leetcode刷题:二叉树10(完全二叉树的节点个数)
走入并行的世界
怎么挑选好的外盘平台,安全正规的?
强化学习-学习笔记4 | Actor-Critic
股票开户哪里好?网上客户经理开户安全吗
mongodb/文档操作
[quick start to digital IC Verification] 8. Typical circuits in digital ICs and their corresponding Verilog description methods
Leetcode(347)——前 K 个高频元素
Go language learning tutorial (XV)
About the priority of Bram IP reset
[C language] three implementations of quick sorting and optimization details
Informatics Olympiad 1337: [example 3-2] word search tree | Luogu p5755 [noi2000] word search tree