uni-app实现分页--(1)准备工作,首页下拉触底加载更多

实现流程如下:

分析:需要在滚动容器中添加滚动触底,在猜你喜欢中获取数据。难点:如何在父页面调用子组件内的方法。父组件中用ref,并定义组件实例类型,子组件中暴露方法

具体代码如下:

1.在父组件中添加scrolltolower事件,用于调用子组件方法获取数据

2.给子组件添加ref属性,并给定义组件实例类型

考虑到组件实例会在多处用到,直接早types的component.d.ts中定义

3.在子组件中利用defineExpose将方法暴露出去

最后在父组件触底时调用

相关推荐
lhldsg7 小时前
智慧场馆解决方案小程序开发实战:从架构设计到部署指南
java·小程序·uni-app
skiyee8 小时前
🚀 用 17 行代码给 UniApp 加上全局登录拦截
前端·uni-app
Mark1085912 小时前
【踩坑】Uni-app微信小程序自定义组件在 Flex 布局中未铺满整行
微信小程序·小程序·uni-app
梦曦i16 小时前
create-uni-app v1.1.0:结构化生成,工程骨架更规范
前端·uni-app
2501_916007472 天前
Flutter与游戏App加固避坑指南:如何为混合开发与高交互应用选对安全方案?
安全·flutter·游戏·ios·小程序·uni-app·iphone
PedroQue992 天前
@meng-xi/create-uni-app v1.0.0 正式发布
前端·uni-app
肥仔哥哥19302 天前
uniapp开发App一键登录:从技术选型到前后端落地实战--2秒登录,流失率减半:在uniapp里接入一键登录的全过程
uni-app·一键登录设计选型
JackieDYH2 天前
uniapp-幸运抽奖转盘组件-案例
uni-app
ModyQyW2 天前
vite-plugin-uni-manifest 更新了什么
前端·typescript·uni-app
PedroQue993 天前
v2.7.1:修复 H5 端返回死循环闪烁问题
前端·uni-app