Taro 微信小程序 分页上拉加载

news2024/9/23 21:28:04

需求:

页面表头及上面部分都固定,表格数据部分可以滚动,支持分页,上拉加载下一页数据

如果是最后一页需判断一下,上拉不再继续加载数据

效果:

template:

<scroll-view class="db-detail-content-search-menu" type="list" :scroll-y="true" :scroll-top="scrollTop" @scroll="scroll" @scrolltolower="handleScrolltolower">
    <view>里面是table需要滚动的内容</view>
</scroll-view>

data:

let pageNo = ref(1)
let pageSize = ref(30)
let totalPage = ref(0)

 methods:

const handleScrolltolower = () => {
  if (pageNo.value < totalPage.value) {
    pageNo.value++
    getList()
  }
}

let scrollTop = ref(0)

const scroll = () => {}

css:

需给滚动区域一个高度

.db-detail-content-search-menu {
    height: calc(100vh - 112px - 96px - 144px);
    background: #ffffff;
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

BodySlide and Outfit Studio 身形编辑器和模型编辑器v4.7.1汉化版以及使用和汉化方法

感谢小莫汉化&#xff01; 汉化版下载地址&#xff1a;https://pan.quark.cn/s/50987aa39805

《NLP自然语言处理》—— 关键字提取之TF-IDF算法

文章目录 一、TF-IDF算法介绍二、举例说明三、示例&#xff1a;代码实现四、总结 一、TF-IDF算法介绍 TF-IDF&#xff08;Term Frequency-Inverse Document Frequency&#xff09;是一种用于信息检索与文本挖掘的常用加权技术。TF-IDF是一种统计方法&#xff0c;用以评估一个词…

【HarmonyOS NEXT开发】鸿蒙界面开发起步,ArkUI(方舟开发框架)介绍,知识点详解

【HarmonyOS NEXT开发】鸿蒙界面开发起步&#xff0c;ArkUI(方舟开发框架)介绍&#xff0c;知识点详解 大纲 主题&#xff1a;鸿蒙界面开发起步&#xff0c;ArkUI(方舟开发框架)介绍&#xff0c;知识点详解。、 内容摘要&#xff1a;带领直播课的观众一步步熟悉ArkUI的基本框…

语言质量评价对应用翻译质量的影响——以美国市场为例

在竞争激烈的移动应用程序世界中&#xff0c;尤其是在美国这样一个庞大而多样化的市场中&#xff0c;翻译的质量可以决定应用程序的成功与否。语言质量评价对应用翻译的整体质量有着深远的影响&#xff0c;其重要性怎么强调都不为过。 语言质量评价的重要性 语言质量评估是评…

3D打印引领制造业新纪元

增材制造技术&#xff0c;俗称3D打印&#xff0c;作为现代科技发展的璀璨明珠&#xff0c;正稳步迈向制造业舞台的中央&#xff0c;重塑着传统制造行业的格局&#xff0c;一个全新的制造纪元正在悄然到来。 3D打印技术&#xff0c;其核心在于通过精准控制的逐层堆积过程&#x…

SLAM ORB-SLAM2(29)PnP估计姿态

SLAM ORB-SLAM2&#xff08;29&#xff09;PnP估计姿态 1. PnP问题2. EPnP算法2.1. 计算4对控制点的世界坐标2.2. 计算齐次质心坐标2.3. 计算4对控制点的相机坐标2.3.1. 构造M矩阵2.3.2. 计算 M T M M^TM MTM的0特征值对应的特征向量2.3.3. 计算零空间的秩2.3.4. 计算线性组合的…

Openldap可视化工具PhpLdapAdmin服务配置

Openldap可视化工具PhpLdapAdmin服务配置 1、创建组 Create a child entry ------> Generic: Posix Group ------> New Posix Group ------> Create Object 1).Create a child entry 2).Generic: Posix Group 3).New Posix Group 4).Create Object 5).查看创建的组…

嵌入式软件--PCB DAY 4

1.原理图重点 &#xff08;1&#xff09;CH340N为什么有那么多组极。 &#xff08;2&#xff09;TYPEC接口&#xff0c;得到几V的供电&#xff0c;为什么&#xff1f; &#xff08;3&#xff09;P0为什么上拉。 &#xff08;4&#xff09;单片机烧录时要干什么 &#xff0…

【Zookeeper】小白基础入门

1 Zookeeper入门 1.1 概述 1.2 特点 1.3 数据结构 1.4 应用场景 统一命名服务 统一配置管理 统一集群管理 服务动态上下线 软负载均衡 1.5 下载地址 2 Zookeeper本地安装 2.1 本地模式安装 2.2 配置参数解读 3 Zookeeper集群操作 3.1 集群操作 3.1.1 集群安装 3.1.2 选举…

Linux 数据结构 树知识

树&#xff1a;只有一个前驱&#xff0c;但是可以有多个后继 根节点&#xff1a;最顶层节点&#xff08;没有前驱&#xff09; 分支节点&#xff1a;有前驱也有后继 叶子节点&#xff1a;没有后继的节点 层&#xff1a;根节点所在为第一层&#xff0c;每过一个…

【uniapp 解决h5 uni.saveFile 不生效】2种方法解决

用uni.saveFile h5报错 saveFile API saveFile is not yet implemented 查看文档发现不支持h5 解决方法&#xff1a; 这个我用了pc 端一样的方法用a标签来下载保存代码如下&#xff1a; 第一种&#xff1a; const a document.createElement(a);a.href filePath; //filePath …

sqli-labs靶场通关攻略(51-60)

Less-51 1、判断闭合方式 输入?sort1 -- 页面闭合成功 2、查询数据库 输入?sort-1 and updatexml(1,concat(1,database()),1) -- 3、查询数据库中的表 输入?sort-1 and updatexml(1,concat(1,(select group_concat(table_name) from information_schema.tables where …

北京青蓝智慧科技2024数博会:共谋数字经济新篇章

在数字化的浪潮下&#xff0c;大数据企业如雨后春笋般涌现&#xff0c;而应用场景更是无处不在。 伴随着“数博十年”的盛约&#xff0c;新老朋友纷纷涌向贵阳国际会议展览中心&#xff0c;于8月28-30日共襄盛举。 2024中国国际大数据产业博览会&#xff08;简称“数博会”&a…

Django国际化和本地化

【图书介绍】《Django 5企业级Web应用开发实战&#xff08;视频教学版&#xff09;》_django 5企业级web应用开发实战(视频教学版)-CSDN博客 《Django 5企业级Web应用开发实战&#xff08;视频教学版&#xff09;》(王金柱)【摘要 书评 试读】- 京东图书 (jd.com) 本节主要介…

一个最基本的多线程3D渲染器方案

概括 渲染器仍然是大多数现代视频游戏的主要组件。通常&#xff0c;这些流水线通过 3D 图形应用程序接口&#xff08;如 DirectX、OpenGL &#xff09;暴露出来。现代&#xff0c;多核 CPU 已广泛应用于游戏机和个人电脑。为了确保 GPU 能持续不断地处理数据&#xff0c;渲染器…

惠中科技RDS自清洁膜层:光伏行业的清洁革命与创新先锋

在当今全球能源转型和光伏产业蓬勃发展的背景下&#xff0c;光伏电站的运营维护面临着诸多挑战&#xff0c;其中灰尘污染问题尤为突出。灰尘的堆积不仅降低了光伏板的透光率&#xff0c;还直接影响了电站的发电效率和经济效益。为了有效解决这一难题&#xff0c;惠中科技凭借其…

C++日期差值问题(2个日期之间差几天)

上面是牛客网给出的题目。 思路 假设第一个输入的日期为2011 12 03&#xff0c;第二个输入的日期为2024 02 29。 这两个日期并不相等&#xff0c;我们可以让日期2011 12 03一直加1&#xff0c;直到等于2024 02 29为止。 在这个过程中&#xff0c;每1一次&#xff0c;就让re…

情感共鸣:数业智能心大陆重塑AI心理交互新纪元

在科技蓬勃发展的今天&#xff0c;人工智能如同一张大网&#xff0c;与我们的生活密切交织&#xff0c;在多个层面深刻影响着每一个人。而数业智能心大陆&#xff0c;作为 “AI 心理健康” 领域的佼佼者&#xff0c;正以其独特的技术和创新理念&#xff0c; 为人工智能与用户的…

企业EMS - 能源管理系统 - 能源管理系统源码-能源在线监测平台-双碳平台源码

一、介绍 企业EMS - 能源管理系统 - 能源管理系统源码-能源在线监测平台-双碳平台源码’ 二、软件架构 二、功能介绍 三、数字大屏展示 四、数据采集原理 五、软件截图

C++ 有向图算法

概念 Breadth-First Search (BFS) 目的: 主要用于遍历或搜索图中的所有顶点。 特点: 从根节点开始&#xff0c;先访问所有与之相邻的节点&#xff0c;然后再一层一层地深入。 应用: 可以用来寻找两节点间的最短路径&#xff08;当边的权重相等时&#xff09;&#xff0c;检测…