Beispielcode für das WeChat-Applet: Weitere Implementierungsmethoden für das Pull-up-Laden

Der Inhalt dieses Artikels befasst sich mit dem WeChat-Applet-Beispielcode: Weitere Implementierungsmethoden für das Pull-up-Laden, die einen bestimmten Referenzwert haben. Ich hoffe, dass er für Sie hilfreich ist.

1. Codeumgebung

Ich habe am Anfang die Scroll-View-Komponente verwendet, aber als ich sie auf einer echten Maschine verwendete, stellte ich fest, dass die Daten beim Laden weiterer Pull-ups verloren gingen sprang, was sich auf die Benutzerinteraktion auswirkte. Es ist nicht benutzerfreundlich, daher habe ich beschlossen, das Pull-up zu ändern, um mehr Effekte zu laden.

Ich verwende das Wepy-Framework, verweise auf mehrere Online-Dokumente und verweise auch auf die Offizielle Dokumente. Die Hauptverwendung ist das onReachBottom()-Ereignis

2 >Wenn die Daten einen Bildschirm nicht überschreiten, kann das Hochziehen kein

onReachBottom( )

-Ereignis auslösen, daher habe ich folgende Verarbeitung durchgeführt: „(aktuelle Bildschirmhöhe

/

tatsächliche Höhe einer Listenschleife) + 1", um sicherzustellen, dass die Daten einen Bildschirm überschreiten können.

<repeat for="{{recordList}}" key="index" index="index" item="item" >
   <view class="zan-panel">
      <view class="zan-cell">
         <view class="zan-cell__bd">变更内容：{{item.typeText}}</view>
         <view class="zan-cell__ft">￥<text style="padding-left:4rpx">{{item.totalFee/100}}</text></view>
      </view>
      <view class="zan-cell">
         <view class="zan-cell__bd zan-font-12 zan-c-gray-dark">变更时间：{{item.updateTime}}</view>
      </view>
   </view>
</repeat>
<block wx:if="{{recordList.length > pageSize}}">
   <block wx:if="{{updateLoadShow}}">
      <updateLoad :loading="updateLoadShow"></updateLoad>
   </block>
   <view class="doc-description zan-center" style="font-size:12px;" wx:else>
      <text>{{updateLoadTxt}}</text>
   </view>
</block>

Schreiben auf Logikebene:

onLoad() {
    // 获取系统消息
    wepy.getSystemInfo({
      success: (res) => {
        this.height = res.windowHeight
        this.pageSize = Math.round(res.windowHeight / 103) + 1
        this.$apply()
      }
    })
}

Verwandte Empfehlungen:

WeChat-Applet-Beispiel: vier Seitensprungmethoden (mit Code)

Beispiel für das WeChat Mini-Programm: Implementierungscode des Popup-Fensters im WeChat Mini-Programm

Das obige ist der detaillierte Inhalt vonBeispielcode für das WeChat-Applet: Weitere Implementierungsmethoden für das Pull-up-Laden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!