Uniapp小程序开发实现页面的触底加载更多

我们在Uniapp小程序开发过程中,经常会遇到页面数据触底加载更多的功能,今天知码客小编就来分享一个自己常用的方法,以最基本最好理解的uniapp小程序开发的方式分享给大家

核心的就是后端控制器进行分页,前端触底后传入分页给后端,返回对应的数据然后链接到当前已加载的数据的后面即可

后端控制器

这里我们以thinkphp5为例,因为小编熟悉这个框架


$list = 模型::where($where)->field("*")->order("id", "desc")->paginate(["page" => $page, "list_rows" => $limit]);

Uniapp页面

onReachBottom() {
if (this.page < this.pageList.current_page) {
    this.page++
        //您自己的方法
    this.order_orderApi()
}
},

主要的流程就是定义个页码变量默认页码为1然后触底后进行增加1传入后台请求最新的数据然后通过.push累加上新数据就行了

0 条评论

还没有人发表评论

发表评论 取消回复

记住我的信息,方便下次评论
有人回复时邮件通知我