VPS参考测评推荐
专注分享VPS主机优惠信息
衡天云优惠活动
华纳云优惠活动
荫云优惠活动

如何在小程序中实现下拉刷新页面的功能(小程序滚动-视图下拉更新)

主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情!
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作

如何在我的小程序中实现下拉刷新页面的功能?下一篇我将介绍如何在微信小程序界面中实现下拉刷新。 有一定的标准值。 请转告给有困难的朋友。 我希望这对你有帮助。

在微信小程序中,使用下拉刷新页面是基本操作。 当前页面满后,继续下拉以加载更多内容。 小程序和网页都可以实现该功能。 不同的是,小程序接口有一个API,您可以简单地从系统中调用该API来实现您需要的下拉刷新功能。

如果你查看微信开发文档,可以看到enablePullDownRefresh属性设置为true。 默认情况下启用下拉更新。 EnablePullDownRefresh可以写在页面的app.json和xxx.json中。 两者的区别在于app.json是全局下拉更新,而***.json是单页面下拉更新。 只能配置与窗口相关的设置。 这是一个决定本页面窗口性能的设置项,所以不需要写窗口键。 另一个选择是监听scroll-view并自定义下拉列表更新。 scroll-view 有一个 bindscrolltoupper 属性。 向上/向左滚动会触发scrolltoupper事件,因此可以使用该属性来实现下拉更新功能。

两种方法都可以。 第一个相对简单且易于使用。 毕竟有些逻辑系统已经处理好了。 第二种方法适合需要自定义下拉列表更新样式的小程序。 在描述电子商务时,我们将使用系统提供的第一个。 主要目的是教大家如何使用。

1.home.json参数设置

enablePullDownRefresh: true

哪个页面需要下拉刷新,在该页面的属性中配置即可。对应的xxx.json文件。 该属性的字面含义告诉您是否允许更新下拉列表。 当然,如果不想将每个配置都配置为允许下拉更新,可以直接在窗口的全局变量app.json中配置上述属性。这允许更新整个项目的下拉列表。 由于系统默认没有下拉更新功能,因此需要添加此功能。

home.js

//PullDownRefresh:function() {wx.showNavigationBarLoading() // 显示加载标题栏 //模拟加载 setTimeout(function(){// 完成wx.hideNavigationBarLoading() //完成加载并停止 wx.stopPullDownRefresh() //停止更新下拉},1500) ;},

onPullDownRefresh 下拉 监听刷新事件,特别是wx看看.showNavigationBarLoading()和wx里面的代码.hideNavigationBarLoading()。 这两个语句用来控制小菊花的可见和隐藏。 这还不存在。 根据网络请求,我模拟了网络负载,并通过setTimeout方法创建了一个延时方法。 此方法允许您模拟网络负载下所花费的时间。 一旦网络完成加载,您还应该停止下拉更新wx.stopPullDownRefresh。 ()。

加载更多

加载更多的方法有两种。

1. 调用系统API。

2. 监视器滚动-视图,将滚动绑定到监视器底部的下部幻灯片。

该过程与下拉更新略有不同,但相似。

home.js

onReachBottom: function () {console.log(\'加载更多\')setTimeout(() => {this.setData({ isHideLoadMore:true,recommends: [ {goodId: 7, 姓名:\'....\',url:\'....\',imageurl:\'....\',},{goodId: 10,名称:\'.. ..\',url:\'....\',},] ,})}, 1000)}

onReachBottom系统提供的底部事件监听同: 更新下拉菜单。 另外模拟一些数据,添加一个延时事件isHideLoadMore。 这是

Loading

的自定义值,用于控制加载控件的可见性。

home.wxml

Loading

还有其他方法可以在模仿 H5 网页的小程序中实现下拉更新。 不过微信小程序使用API​​接口,可以减轻开发者实现下拉更新功能时的负担。 。

推荐:《小程序开发教程》

PHP快速学习视频免费教程(从入门到精通)

如何学习PHP入门?怎样才能快速学习PHP呢? 这里有简单的 PHP 学习教程(从初学者到专家)。 您可以保存并下载您想学习的朋友。

下载

这几篇文章你可能也喜欢:

本文由主机参考刊发,转载请注明:如何在小程序中实现下拉刷新页面的功能(小程序滚动-视图下拉更新) https://zhujicankao.com/124177.html

【腾讯云】领8888元采购礼包,抢爆款云服务器 每月 9元起,个人开发者加享折上折!
打赏
转载请注明原文链接:主机参考 » 如何在小程序中实现下拉刷新页面的功能(小程序滚动-视图下拉更新)
主机参考仅做资料收集,不对商家任何信息及交易做信用担保,购买前请注意风险,有交易纠纷请自行解决!请查阅:特别声明

评论 抢沙发

评论前必须登录!