时间:2021-05-18
本文实例为大家分享了微信小程序上拉加载的具体代码,供大家参考,具体内容如下
demo.wxml 文件
<view wx:for="{{listdata}}" wx:key="listdata" class='listitem'> <view class='title'>{{ item.store_name }}</view> <image src='{{item.logo}}'></image></view><view class="load-more-wrap"> <block wx:if="{{hasMore}}"> <view class="load-content"> <text class="weui-loading"/><text class="loading-text">玩命加载中</text> </view> </block> <block wx:else> <view class="load-content"> <text>没有更多内容了</text> </view> </block></view>demo.js文件
Page({ data: { listdata:[], //数据 paginated: '', //{total:"12", count: 10, more: 1} total数据总数,count:当前分页数据数据,more:1表示还有,0表示无数据 p:0, //当前分页;默认第一页 hasMore:true //提示 }, onLoad: function (options) { var that = this; var p = that.data.p; this.loadmore(); }, onReachBottom:function(){ var that = this; var paginated = that.data.paginated; if (paginated.more != 0) { this.loadmore(); }else{ that.setData({ "hasMore": false }) } }, loadmore:function(){ wx.showToast({ title: "玩命加载中", icon: 'loading', duration: 1000 }) var that = this; var p = ++that.data.p; wx.request({ url: 'xxx', data: { "json": JSON.stringify({ "demo": "xxx", "p": p }) }, method: 'POST', header: { 'content-type': 'application/x-www-form-urlencoded' }, success:function(res){ if (res.data.data != 0) { that.setData({ "listdata": that.data.listdata.concat(res.data.data), //加载数据 "paginated": res.data.paginated, //{total:"12", count: 10, more: 1} 此处主要用于上拉加载是否加载数据 "p":p }) } else { that.setData({ "hasMore":false }) } } }) }})以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了微信小程序实现上拉加载功能。分享给大家供大家参考,具体如下:开发需求进入页面,加载初始数据,当向上拖动页面至底部,自动加载新的数据,即上拉加载更多
微信小程序scroll-view实现上拉加载与下拉刷新的实例实现效果图:如图,使用小程序的scroll-view实现的上拉加载数据,下拉刷新数据,试下代码如下:
由于微信小程序没有提供类似Image这样的JS对象,要实现图片的预加载要麻烦一些,wxapp-img-loader自定义组件可以在微信小程序中实现图片预加载功能
今天介绍微信小程序中scroll-view实现横向滚动和上拉加载的实现及需要注意的地方。先看最终效果。横向滚动1.设置滚动项display:inline-blo
本文实例为大家分享了微信小程序加载更多功能实现的具体代码,供大家参考,具体内容如下微信小程序加载更多,是将之前的数据和点击加载后请求的数据用concat拼接在一