微信小程序下拉刷新上拉加載的兩種實(shí)現(xiàn)方法

這篇文章將為大家詳細(xì)講解有關(guān)微信小程序下拉刷新上拉加載的兩種實(shí)現(xiàn)方法，小編覺得挺實(shí)用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

微信小程序下拉刷新上拉加載的兩種實(shí)現(xiàn)方法，

1、利用"onPullDownRefresh"和"onReachBottom"方法實(shí)現(xiàn)小程序下拉刷新上拉加載

2、在scroll-view里設(shè)定bindscrolltoupper和bindscrolltolower實(shí)現(xiàn)微信小程序下拉刷新上拉加載。

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里設(shè)定bindscrolltoupper和bindscrolltolower

在scroll-view里設(shè)定bindscrolltoupper和bindscrolltolower，然后在js里寫好觸發(fā)事件后對應(yīng)的方法。[注意，使用這個模式一定要設(shè)置scroll-view的高度，100%不知道為什么設(shè)置后沒效果，建議使用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 下一頁');
 },

關(guān)于“微信小程序下拉刷新上拉加載的兩種實(shí)現(xiàn)方法”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學(xué)到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。