#Uniapp: onReachBottom页面触底的事件回调

onReachBottom页面触底的事件回调

定义

页面上拉触底事件触发时距页面底部距离,单位只支持px,详见页面生命周期

可在pages.json里定义具体页面底部的触发距离onReachBottomDistance

js 复制代码
"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
		{
			"path": "pages/message/message",
			"style": {
				"navigationBarTitleText": "信息",
				"enablePullDownRefresh": true,
				"onReachBottomDistance": 200, // 页面触底的距离
				"navigationBarBackgroundColor": "#00ff00",
				"h5": { // h5页面特定样式
					"titleNView": {
						"backgroundColor": "#ffff00"
					}
				}
			}
		}]

比如设为50,那么滚动页面到距离底部50px时,就会触发onReachBottom事件。

如使用scroll-view导致页面没有滚动,则触底事件不会被触发。scroll-view滚动到底部的事件请参考scroll-view的文档。

事件

js 复制代码
onReachBottom() {
			console.log('xiaoo')
		}
相关推荐
大白要努力!2 天前
uni-app 全面入门速查手册
前端·uni-app
李剑一2 天前
uni-app x 实现本地 JSON 文件的导入导出(APP端可用)
android·前端·uni-app
2501_915106322 天前
iOS 软件测试工具性能监控、日志分析 KeyMob、Instruments等
android·ios·小程序·https·uni-app·iphone·webview
PedroQue993 天前
uni-router v2.0.0:四大功能拆分为插件,按需加载
前端·uni-app
不法4 天前
uniapp map地图导航/地图路线
前端·vue.js·uni-app
淡淡的幼稚5 天前
【YFIOs】从传感芯片到表格曲线
uni-app·.net
宠友信息5 天前
多端即时通讯源码技术实践,Redis路由、MySQL持久化与Socket接入
spring boot·websocket·mysql·uni-app
宠友信息5 天前
Spring Boot与异步审核构建仿小红书源码内容发布全流程
java·数据库·spring boot·redis·mysql·oracle·uni-app
蜡台5 天前
uniapp vue2 转 vue3
前端·javascript·uni-app·vue3·vue2
2501_916008895 天前
iOS 证书管理最佳实践 从创建到续期的完整指南
android·ios·小程序·https·uni-app·iphone·webview