WeChat applet — detailed explanation of pull-up loading

Hits: 0

index.wxml:

<scroll-view scroll-y style="height:100vh;" bindscrolltolower="lower" scroll-into-view="{{toView}}" scroll-top="{{scrollTop}}">
  <view class = 'content-wrapper' upper-threshold>
     //here is the category page style for pull-up loading
  </view>
</scroll-view>

Note: style="height:100vh;"It means to monitor the current window area, and it will be triggered when it exceeds the current visible area.bindscrolltolower="lower"

index.js:

lower: function ( e ) { // pull-up loading 
    console .log(e)
     //here is the pull-up loading request code 
  },

Tips: If multi-layer scroll-viewscrolling is required during development, scroll-viewthere will be sliding penetration, and you bindscrolltolowercan change it to this time catchtouchmove.

Ps: upper-threshold is to allow vertical scrolling

You may also like...

Leave a Reply

Your email address will not be published.