附录3-小程序常用事件

2024-05-02 04:36
文章标签 程序 事件 常用 附录

本文主要是介绍附录3-小程序常用事件,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

目录

1  点击事件 tap

2  文本框输入事件 input

3  状态改变事件 change

4  下拉刷新事件 onPullDownRefresh()

5  上拉触底事件 onReachBottom()


1  点击事件 tap

2  文本框输入事件 input

可以使用 e.detail.value 打印出当前文本框的值

我现在在文本框中依次输入12345,在console中会打印出当前的值

一般我们会给一个data专门存储文本框的内容,方便接下来调用

刷新后是这样的

数据与文本框双向绑定

  • 双向绑定是因为有value,如果没有value那就是单向绑定

3  状态改变事件 change

小程序中change可以在组件swiper中使用

  • checkbox是没有change事件的

轮播图切换的时候会触发change事件,可以使用e.detail.current.id获得当前轮播图的索引

4  下拉刷新事件 onPullDownRefresh()

首先你需要在页面(或全局)中启用下拉刷新,下拉刷新一般只在页面中配置

配置之后进行编译,然后向下拽页面,就会有这种效果

  • 详细的配置效果可以看 10.全局配置 app.json与页面配置

在页面的JS文件中有一个 onPullDownRefresh(),我们在里面写上想执行的内容就行了

在 真机 上下拉的效果不会自动关闭,我们需要在onPullDownRefresh()的最后加上wx.stopPullDownRefresh()实现完成动作后关闭效果

  • wx.stopPullDownRefresh()括号中可以写一个回调函数

5  上拉触底事件 onReachBottom()

上拉触底就是你逛 电商APP 的时候,你向下拉商品的时候,发现下面总是有商品,你拉到一定程度的时候就会给你自动加载一批新的

每个页面默认都有上拉触底功能,为了体现上拉触底,我们首先给page一个很高的高度

  • 当页面可以上拉的时候才有上拉触底功能,如果你页面上拉不了(一页能显示所有东西)那么是触发不了上拉触底的

然后在 onReachBottom() 中写上一些内容

当进度条距离最后还有一段距离的时候,就会触发上拉触底

  • 上拉触底的距离可以自己设置(onReachBottomDistance),默认为50px,设置方法可以看一下 10.全局配置 app.json 与页面配置

默认情况下,你反复在底部拖动进度条,下拉触底会反复触发

所以你的下拉处理的内容要做节流的处理,节流可以看一下这个 https://blog.csdn.net/potato123232/article/details/130108489 

这篇关于附录3-小程序常用事件的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/953396

相关文章

MyBatis常用XML语法详解

《MyBatis常用XML语法详解》文章介绍了MyBatis常用XML语法,包括结果映射、查询语句、插入语句、更新语句、删除语句、动态SQL标签以及ehcache.xml文件的使用,感兴趣的朋友跟随小... 目录1、定义结果映射2、查询语句3、插入语句4、更新语句5、删除语句6、动态 SQL 标签7、ehc

Python打包成exe常用的四种方法小结

《Python打包成exe常用的四种方法小结》本文主要介绍了Python打包成exe常用的四种方法,包括PyInstaller、cx_Freeze、Py2exe、Nuitka,文中通过示例代码介绍的非... 目录一.PyInstaller11.安装:2. PyInstaller常用参数下面是pyinstal

java程序远程debug原理与配置全过程

《java程序远程debug原理与配置全过程》文章介绍了Java远程调试的JPDA体系,包含JVMTI监控JVM、JDWP传输调试命令、JDI提供调试接口,通过-Xdebug、-Xrunjdwp参数配... 目录背景组成模块间联系IBM对三个模块的详细介绍编程使用总结背景日常工作中,每个程序员都会遇到bu

Python 常用数据类型详解之字符串、列表、字典操作方法

《Python常用数据类型详解之字符串、列表、字典操作方法》在Python中,字符串、列表和字典是最常用的数据类型,它们在数据处理、程序设计和算法实现中扮演着重要角色,接下来通过本文给大家介绍这三种... 目录一、字符串(String)(一)创建字符串(二)字符串操作1. 字符串连接2. 字符串重复3. 字

uni-app小程序项目中实现前端图片压缩实现方式(附详细代码)

《uni-app小程序项目中实现前端图片压缩实现方式(附详细代码)》在uni-app开发中,文件上传和图片处理是很常见的需求,但也经常会遇到各种问题,下面:本文主要介绍uni-app小程序项目中实... 目录方式一:使用<canvas>实现图片压缩(推荐,兼容性好)示例代码(小程序平台):方式二:使用uni

python语言中的常用容器(集合)示例详解

《python语言中的常用容器(集合)示例详解》Python集合是一种无序且不重复的数据容器,它可以存储任意类型的对象,包括数字、字符串、元组等,下面:本文主要介绍python语言中常用容器(集合... 目录1.核心内置容器1. 列表2. 元组3. 集合4. 冻结集合5. 字典2.collections模块

python获取指定名字的程序的文件路径的两种方法

《python获取指定名字的程序的文件路径的两种方法》本文主要介绍了python获取指定名字的程序的文件路径的两种方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要... 最近在做项目,需要用到给定一个程序名字就可以自动获取到这个程序在Windows系统下的绝对路径,以下

JavaScript中比较两个数组是否有相同元素(交集)的三种常用方法

《JavaScript中比较两个数组是否有相同元素(交集)的三种常用方法》:本文主要介绍JavaScript中比较两个数组是否有相同元素(交集)的三种常用方法,每种方法结合实例代码给大家介绍的非常... 目录引言:为什么"相等"判断如此重要?方法1:使用some()+includes()(适合小数组)方法2

SpringBoot 获取请求参数的常用注解及用法

《SpringBoot获取请求参数的常用注解及用法》SpringBoot通过@RequestParam、@PathVariable等注解支持从HTTP请求中获取参数,涵盖查询、路径、请求体、头、C... 目录SpringBoot 提供了多种注解来方便地从 HTTP 请求中获取参数以下是主要的注解及其用法:1

基于Python编写自动化邮件发送程序(进阶版)

《基于Python编写自动化邮件发送程序(进阶版)》在数字化时代,自动化邮件发送功能已成为企业和个人提升工作效率的重要工具,本文将使用Python编写一个简单的自动化邮件发送程序,希望对大家有所帮助... 目录理解SMTP协议基础配置开发环境构建邮件发送函数核心逻辑实现完整发送流程添加附件支持功能实现htm