加载中 ...
首页 > 新闻资讯 > 小程序 正文

小程序滚动加载更多函数实现

2019-07-31 10:26:05 来源:沈阳小程序开发 作者:沈阳软件开发

小程序滚动加载更多的是小程序的基本操作函数,如何实现呢? 1.需要组件和apis

滚动视图(可滚动视图区域)

wx.showToast(OBJECT)显示消息提示窗口----显示加载小菊花

2.您需要使用的属性

21708-1P13115104Y62.jpg

3.scrol-view需要指定一个高度,可以根据自己的需要计算,一般使用屏幕的可用高度,默认显示为6.

4.滚动到底部以绑定需要触发的事件

5.操作事件功能主要是将请求的数据与concat方法合并,然后赋值。我使用for循环来假装添加数据。实际项目可以用自己的ajax替换,我将其添加到模拟加载中。一个1.5秒的计时器,首先调用提示框api成功并关闭

Lower(){var result=this.data.res; var resArr=[]; //您可以使用自己的ajax(let i=0; i< 10; i ++){resArr.push(i); Var cont=result.concat(resArr); //合并请求数据console.log(resArr.length); if(cont.length>=100){wx.showToast({//期间可以添加显示效果一个过多的弹出框提示“加载”标题:'我也有底线',图标:'成功',持续时间: 300});返回false; } else {wx.showLoading({//期间以显示效果添加过多的弹出提示“正在加载”标题:'正在加载',图标:'正在加载',}); setTimeout(()=> {this.setData({res: cont}); wx.hideLoading();},1500)}}

6.成功,把完整的代码直接复制到运行

Wxml代码

{{项}

HiShop小程序工具提供多种类型的商城/商店小程序制作,可视化编辑1秒,在线生成5个步骤。通过拖动和拼接模块布局小程序商城页面,你可以看到你得到的东西,你只需要艺术家来制作一个漂亮的商场。

有关更多小程序的信息,请访问:www.hvihi.com/xiaocx/

< 汇海(www.hvihi.com)是国内知名的商城系统和商城网站建设提供商,其中汇海技术小程序系统提供小程序商城开发,小程序配送系统,微分配系统,商城系统,电子商务网站建设, 微信发行系统,小程序商城及其他多端商场和电子商务行业解决方案>

确认:这个文件和图像源网络编辑器的网站部分,如果有侵权及时通信删除。 汇海hvihi.com网站原创文章,请注明出处。

“沈阳软件公司”的新闻页面文章、图片、音频、视频等稿件均为自媒体人、第三方机构发布或转载。如稿件涉及版权等问题,请与

我们联系删除或处理,客服QQ:55506560,稿件内容仅为传递更多信息之目的,不代表本网观点,亦不代表本网站赞同

其观点或证实其内容的真实性。