争怎路由网/应用软件/内容

微信小程序中的下拉刷新与上拉加载的完成方法详细说明

应用软件2024-02-20 阅读
微信小程序，简称小程序，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。小程序是一种不用下载就能使用的应用，也是一项门槛非常高的创新，经过将近两年的发展，已经构造了新的小程序开发环境和开发者生态。
微信小程序下拉刷新上拉加载的两种实现方法，1、利用"onPullDownRefresh"和"onReachBottom"方法实现小程序下拉刷新上拉加载，2、在scroll-view里设定bindscrolltoupper和bindscrolltolower实现微信小程序下拉刷新上拉加载。

1. 利用"onPullDownRefresh"和"onReachBottom"方法

在js文件里直接写"onPullDownRefresh"和"onReachBottom"方法即可；

xml

<scroll-view scroll-y = true >    
    .........
</scroll-view>

js

onPullDownRefresh: function() {
    // Do something when pull down.
     console.log('刷新');
 },
 onReachBottom: function() {
    // Do something when page reach bottom.
     console.log('circle 下一页');
 },

2. 在scroll-view里设定bindscrolltoupper和bindscrolltolower

在scroll-view里设定bindscrolltoupper和bindscrolltolower，然后在js里写好触发事件后对应的方法。[注意，使用这个模式一定要设置scroll-view的高度，100%不知道为什么设置后没效果，建议使用100vh]

xml

<scroll-view scroll-y = true bindscrolltolower="loadMore" bindscrolltoupper="refesh">
    ..........
</scroll-view>
js
onPullDownRefresh: function() {
    // Do something when pull down.
     console.log('刷新');
 },
 onReachBottom: function() {
    // Do something when page reach bottom.
     console.log('circle 下一页');
 },
以上就是微信小程序中的下拉刷新和上拉加载的实现方法详解的详细内容，更多请关注php中文网其它相关文章！
				
				
小程序是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或者搜一下即可打开应用。



      
……
标签:微信小程序中的下拉刷新与上拉加载的完成办法详细说明
 
相关阅读