微信小程序-上拉加载和下拉刷新

一.上拉加载

微信小程序的上拉加载使用onReachBottom(),写在.js文件里面的Page方法里面。

onReachBottom(){
    //上拉自动更新到4,5,6
    wx.showLoading({
      title: '数据加载中...',
    })
    setTimeout(()=>{
      const lastNum=this.data.numList[this.data.numList.length-1]
      const newAry=[lastNum+1,lastNum+2,lastNum+3]
      this.setData({
        numList:[...this.data.numList,...newAry]
      })
      wx.hideLoading()
    },1500)
  }

onReachBottom()会监听微信小程序上拉操作。
需要在.json文件里面配置"onReachBottomDistance"属性。
如下面的代码,在距离底部50px的时候会触发到onReachBottom()

"onReachBottomDistance": 50px

二.下拉刷新

下拉刷新使用onPullDownRefresh()

  onPullDownRefresh(){
    //下拉刷新后,显示1,2,3
    this.setData({
      numList:[1,2,3]
    })
    if(this.data.numList.length === 3){
      wx.stopPullDownRefresh()
    }
  }

注意,在使用onPullDownRefresh() 的时候,需要及时使用wx.stopPullDownRefresh()进行关闭,不然可能会长时间显示刷新状态
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/724452.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

JavaScript事件传播实战

上篇文章我们学习了事件传播的冒泡和捕获两种类型,现在我们在实际项目中演示一下; ● 首先我们先定义一个随机数 const randomInt (min, max) > Math.floor(Math.random() * (max - min 1) min);● 接着,我们使用随机数来创建随机的r…

移植案例与原理 - HDF驱动框架-驱动配置(2)

1.2.7 节点复制 节点复制可以实现在节点定义时从另一个节点先复制内容,用于定义内容相似的节点。语法如下,表示在定义"node"节点时将另一个节点"source_node"的属性复制过来。 node : source_node示例如下,编译后bar节点…

[15] 使用Opencv_CUDA 模块实现基本计算机视觉程序

使用Opencv_CUDA 模块实现基本计算机视觉程序 CUDA提供了出色的接口&#xff0c;发挥GPU的并行计算能力来加速复杂的计算应用程序利用CUDA和Opencv的功能实现计算机视觉应用 1. 对图像的算术和逻辑运算 两个图像相加 #include <iostream> #include "opencv2/ope…

DIVE INTO DEEP LEARNING 36-49

文章目录 36. Data augmentation36.1 Training with enhanced data36.2 Enhancement measures36.3 Data augmentation summary 37. Fine tuning37.1 Fine tuning Introduce37.2 Fine tuning Step37.3 Fine tuning summary 38. Object detection38.1 Object detection38.2 Edge …

计算机网络实验(8):常用网络命令

一、实验名称 常用网络命令 二、实验目的&#xff1a; 1. 掌握网络常用命令Hostname、Ipconfig、Route、Arp、Ping、Tracert、Nslookup、Net use、NbtStat、Netstat、Net view的使用方法&#xff1b; 2. 理解网络常用命令Hostname、Ipconfig、Route、Arp、Ping、Tracert、Ns…

调试 Kubernetes - 故障排除指南

随着 Kubernetes 不断彻底改变我们管理和部署应用程序的方式&#xff0c;了解其复杂性对于开发人员和运营团队来说都变得至关重要。如果您没有专门的 DevOps 团队&#xff0c;您可能不应该使用 Kubernetes。尽管如此&#xff0c;在某些情况下&#xff0c;当我们调试问题时&…

网页发起 http 请求的全过程详解图

原文地址&#xff1a;https://dev.to/gallau/lifecycle-of-a-url-request-2gan

stable diffusion 局部重绘 reference-only api 接口调试

webUI api payload 插件生成的接口参数不准确&#xff0c;reference-only 的image不是对象&#xff0c;就是不同字符串字段&#xff0c;直接传&#xff0c;不是套image。 综上&#xff0c;那个插件参数不确定&#xff0c;应直接看插件的源码&#xff0c;看它接受什么参数 错误…

Vue3 + TS + Antd + Pinia 从零搭建后台系统(四) ant-design-vue Layout布局,导航栏,标签页

书接上回本篇主要介绍&#xff1a; Layout布局&#xff0c;导航栏&#xff0c;标签页继续填充目录 按需引入组件Layout布局&#xff0c;导航栏&#xff0c;标签页css样式 按需引入组件 使用unplugin-vue-components插件完成ant-design-vue组件的按需加载。 前文中已处理过&…

基于SSM的个人博客管理系统

有需要请加文章底部Q哦 可远程调试 基于SSM的个人博客管理系统 一 介绍 个人博客管理系统基于SSM框架开发&#xff0c;数据库mysql&#xff0c;前端layui。系统角色分为用户和管理员。(附带配套设计文档!) 技术栈&#xff1a;JavaSSM框架mysqllayuiIDEAMaventomcat8.5jdk1.8 …

彻底卸载Ubuntu双系统

操作系统 文章目录 操作系统前言一、把开机启动项设为默认Windows启动二、删除Ubuntu系统分区三、删除开机启动引导项 前言 我们卸载Ubuntu双系统&#xff0c;可能出于以下原因&#xff1a; 1、Ubuntu系统内核损坏无法正常进入 2、Ubuntu系统分配空间不足&#xff0c;直接扩区…

就因为没在大屏项目加全屏按钮,早上在地铁挨了领导一顿骂

“嗯嗯”&#xff0c;“嗯嗯”&#xff0c;“那产品也没说加呀”&#xff0c;“按F11不行吗&#xff1f;”&#xff0c;“嗯嗯”&#xff0c;“好的”。 早上在4号线上&#xff0c;我正坐在地铁里&#xff0c;边上站着的妹子&#xff0c;我看他背着双肩包&#xff0c;打着电话…

HeidiSQL导入与导出数据

HeidiSQL两种导入与导出数据的方法&#xff1a;整个库复制&#xff0c;和仅复制数据 一 整个库复制 1 选中需要导出的数据库(这里是MyDBdata)&#xff0c;点击导出为SQL脚本。 2 按照如图进行选择 3 选做&#xff1a;删除当前数据库【如果有】 -- 删除数据库 USE mysql; D…

白酒:中国的酒文化的传承与发扬

中国&#xff0c;一个拥有五千年文明史的国度&#xff0c;其深厚的文化底蕴孕育出了丰富多彩的酒文化。在这片广袤的土地上&#xff0c;酒不仅仅是一种产品&#xff0c;更是一种情感的寄托&#xff0c;一种文化的传承。云仓酒庄的豪迈白酒&#xff0c;正是这一文化脉络中的一颗…

图卷积网络(Graph Convolutional Network, GCN)

图卷积网络&#xff08;Graph Convolutional Network, GCN&#xff09;是一种用于处理图结构数据的深度学习模型。GCN编码器的核心思想是通过邻接节点的信息聚合来更新节点表示。 图的表示 一个图 G通常表示为 G(V,E)&#xff0c;其中&#xff1a; V 是节点集合&#xff0c;…

2024青海三支一扶报名流程图解❗

报考公告 1、招考人数&#xff1a; 1910 人 2、报名时间&#xff1a;6月20-6月25 3、笔试时间&#xff1a;7月6日 4、笔试内容&#xff1a;综合知识和能力素质测验 &#x1f534;线上报名流程图解 一、本次报名采用线上报名方式&#xff0c;考生需登录《青海省人事考试信息网》…

xss一些笔记

&#xff08;乱写的一些笔记&#xff09; innerHTML只防script像是img就不会防 innerText都防 上面代码执行避免用户交互 js也可以用’‘执行 例子 alert’1‘ document.location.hash // #号后的部分&#xff0c;包括#号 document.location.host // 域名…

广告权重及出价解析

由于算法一直在不断改变&#xff0c;所以公式只能作为参考&#xff0c;不过核心是不变的。一、广告权重及出价解析 链接质量分CTR分值**CR分值&#xff08;点击率*转化率&#xff09;广告质量分广告出价*链接质量分我们的出价下一名产品的广告质量评分/我们的链接质量分0.01 …

Building wheels for collected packages: mmcv, mmcv-full 卡住

安装 anime-face-detector 的时候遇到一个问题&#xff1a;Installation takes forever #1386&#xff1a;在构建mmcv-full时卡住&#xff0c;这里分享下解决方法&#xff08;安装 mmcv 同理&#xff0c;将下面命令中的 mmcv-full 替换成 mmcv&#xff09; 具体表现如下&#x…

“华数杯”全国大学生数学建模竞赛含金量如何?

“华数杯”全国大学生数学建模竞赛是由华中师范大学主办的一项全国性的大学生数学建模竞赛。该竞赛旨在提高大学生的数学建模能力和实践能力&#xff0c;增强大学生的创新意识和团队协作精神。 搜集一些评价&#xff0c;有人说该竞赛的含金量较高&#xff0c;但是也有一些人认…