微信小程序事件监听方法

简介: 微信小程序事件监听方法

微信小程序中,事件监听是通过在WXML文件中使用属性来实现的。以下是一些常用的事件监听方法:

bind开头的事件监听:

使用bind开头的属性来绑定事件监听,这样的事件会冒泡,即事件会从触发的组件一直向上层组件传递。

<view bindtap="handleTap">点击我触发tap事件</view>
1. Page({
2. handleTap: function (event) {
3. console.log("tap事件触发", event);
4.   },
5. });

catch开头的事件监听:

使用catch开头的属性来绑定事件监听,这样的事件会被阻止冒泡,即事件不会向上层组件传递。

<view catchtap="handleCatchTap">点击我触发catchtap事件</view>
1. Page({
2. handleCatchTap: function (event) {
3. console.log("catchtap事件触发", event);
4.   },
5. });

表单事件监听:

对于表单元素(如和),可以使用特定的表单事件进行监听,如bindinput(输入事件)、bindsubmit(表单提交事件)等。

1. <form bindsubmit="handleFormSubmit">
2. <input type="text" bindinput="handleInput">
3. <button formType="submit">提交</button>
4. </form>
1. Page({
2. handleInput: function (event) {
3. console.log("输入的内容", event.detail.value);
4.   },
5. handleFormSubmit: function (event) {
6. console.log("表单提交", event.detail.value);
7.   },
8. });

触摸事件监听:

对于触摸事件,可以使用不同的事件类型进行监听,如bindtouchstart(手指触摸动作开始事件)、bindtouchmove(手指触摸后移动事件)等。

1. <view bindtouchstart="handleTouchStart">触摸我开始</view>
2. <view bindtouchmove="handleTouchMove">触摸我移动</view>
1. Page({
2. handleTouchStart: function (event) {
3. console.log("触摸开始", event);
4.   },
5. handleTouchMove: function (event) {
6. console.log("触摸移动", event);
7.   },
8. });

除了上述事件监听方法,微信小程序还提供了许多其他类型的事件,如网络事件、音视频事件、地图事件等。你可以根据具体的需求,查阅微信小程序官方文档,了解更多事件监听的方法和具体用法。

目录
相关文章
|
3月前
|
数据安全/隐私保护
陌陌头像留V的最好方法,陌陌最新留QQ号技巧,陌陌动态最聪明的留微信
本资料分享社交平台隐秘留联系方式的方法,包含微信头像艺术化处理、二维码变形术,以及QQ号谐音替换、图片分割等技巧。
|
6月前
|
Web App开发 移动开发 小程序
公众号小程序H5网页像素流送UE5模型的方法分享
本文探讨了如何通过像素流送技术在小程序、公众号等平台展示复杂的3D模型(如UE5引擎开发的楼盘模型、数字孪生展厅)。该技术将GPU和CPU算力需求转移到服务器端,使用户侧无需高性能硬件即可流畅体验。通过Webrtc实现实时云渲染,确保毫秒级响应,且兼容多种浏览器。使用点量云流等产品级软件,老项目只需重新打包为EXE格式,即可轻松嵌入H5网页、小程序或公众号中,支持Unity、WebGL等多种3D应用及传统CAD模型。
180 1
|
编解码 小程序
微信小程序11177版本开启控制台方法
微信小程序11177版本开启控制台方法
|
12月前
|
小程序
小程序消除图片下边距的三个方法
小程序消除图片下边距的三个方法
217 69
|
缓存 小程序 数据库
小程序页面之间(传值)传递数据的方法
小程序页面之间(传值)传递数据的方法
385 63
|
小程序 JavaScript
微信小程序中的页面跳转(通过点击按钮、调用方法的形式)
这篇文章讲解了微信小程序中页面跳转的方法,包括使用按钮点击事件和调用方法实现跳转,以及推荐使用`this.pageRouter.navigateTo`代替`wx.navigateTo`的方式。
微信小程序中的页面跳转(通过点击按钮、调用方法的形式)
|
小程序 安全
Fiddler抓取小程序后端请求导入AppScan扫描快捷方法
【8月更文挑战第26天】这是一种利用 Fiddler 捕获小程序后端请求并导入 AppScan 进行安全扫描的方法。首先安装配置 Fiddler 并设置手机代理,通过 Fiddler 捕获请求;接着导出这些请求为 .saz 文件,并在 AppScan 中导入此文件,配置扫描参数后启动扫描以检测安全漏洞。操作时需确保有合法授权并遵循相关法规。尽管不同版本软件操作细节可能有所不同,但整体流程类似。
507 1
|
小程序 JavaScript API
小程序实现分享的三种方法
【8月更文挑战第20天】
|
小程序
微信小程序APPID的两种查看方法
查看微信小程序APPID的两种方法:1) 在小程序内点击右上角“...”,进入查看页面,点击“更多资料”查看;2) 登录微信公众平台([https://mp.weixin.qq.com/](https://mp.weixin.qq.com/)),进入【设置】查看“账号信息”。
10609 1

热门文章

最新文章