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

实现流程如下:

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

具体代码如下:

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

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

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

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

最后在父组件触底时调用

相关推荐
Geek_Vison10 小时前
2026 跨端框架横评:FinClip、Taro、uni-app、Remax、mPaaS 五款工具技术+业务双维度测评
小程序·uni-app·taro·mpaas·小程序容器
RuoyiOffice13 小时前
从 0 到 1 搭建 RuoyiOffice:30 分钟跑通后端+前端+移动端
前端·spring boot·uni-app·开源·oa·ruoyioffice·hrm
Geek_Vison14 小时前
APP集成了50多个小程序后,如何搭建一个小程序管理平台来管理这些小程序~
小程序·uni-app·apache·mpaas·小程序容器
梦曦i1 天前
uni-router v1.1.1发布:守卫超时保护+路由监听
前端·uni-app
梦曦i1 天前
全面解析uni-router v1.2.0功能
前端·uni-app
不如摸鱼去1 天前
Wot UI 2.1.0 发布:ConfigProvider 全局配置能力升级
ui·小程序·uni-app
PedroQue991 天前
uni-router:uni-app路由管理新选择
前端·uni-app
这是个栗子1 天前
微信小程序开发(九)- uni-app微信小程序商城
微信小程序·小程序·uni-app·vue·vuex
中犇科技2 天前
2026商城APP开发公司 TOP5(电商垂直版)
uni-app
扁豆的主人2 天前
Uniapp如何构建和部署
uni-app