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

实现流程如下:

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

具体代码如下:

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

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

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

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

最后在父组件触底时调用

相关推荐
2501_915918417 小时前
如何在iPad上找到并打开文件夹的完整指南
android·ios·小程序·uni-app·iphone·webview·ipad
weixin_6383031111 小时前
uniapp组合式和选项式
javascript·vue.js·uni-app
木子啊14 小时前
UniApp Base64上传终极解决方案
uni-app·base64·base64转图片·base64上传
2501_9159184114 小时前
Wireshark、Fiddler、Charles抓包工具详细使用指南
android·ios·小程序·https·uni-app·iphone·webview
阿宇爱吃鱼15 小时前
uniapp input输入框,限制金额输入格式
前端·javascript·uni-app
一只程序熊15 小时前
uniapp x 新手入门指南
uni-app
攻城狮7号1 天前
不懂代码也能造?TRAE+GLM-4.6 手把手教你搭心理咨询智能客服小程序
python·小程序·uni-app·vue·trae·glm我的编程搭子·glm-4.6
QQ588501981 天前
Python_uniapp-心理健康测评服务微信小程序的设计与实现
python·微信小程序·uni-app
三天两行代码1 天前
uniapp 微信小程序实现ai问答功能流式输出makdown解析实现打字机效果(附源码)
微信小程序·小程序·uni-app
三天不学习1 天前
从开发到上架:手把手教你将uni-app微信小程序打包发布(全网最全指南)
微信小程序·uni-app·notepad++