使用es6的语法微信小程序上拉加载

用了一些es6的语法写一个微信小程序上拉加载的Demo

源码如下

• 1.wxml部分

<scroll-view id="scroll-view" scroll-y="true" bindscrolltoupper="bindscrolltoupper" bindscroll="bindscroll" bindscrolltolower="bindscrolltolower">
  <view class="artlist" hover-class="none" hover-stop-propagation="false" wx:for="{
     
     { artList }}">
    <image class="" src="{
     
     { item.picUrl }}" lazy-load="true" binderror=""> </image>
    <text class="" selectable="false" space="false" decode="false">
      {
   
   { item.name }}
    </text>
  </view>
</scroll-view>

• 2.js 部分

  request.js

  //这是封装的js请求
  const request = (url, data = {
        
        }, method = 'get', header = {
        
         'content-type': 'application/json' }) => {
        
        
    return new Promise((reslove, reject) => {
        
        
      wx.request({
        
        
        url: url,
        data: data,
        method: method,
        dataType: 'json',
        header: header, // 默认值
        success: function (res) {
        
        
          reslove(res);
        },
        fail: function (res) {
        
        
          reject(res);
        },
      });
    });
  };
  
  

  api.js

  const baseURL = 'http://182.92.222.190:3000';
  
  export default {
        
        
    //歌手列表
    artList: `${
          
          baseURL}/artist/list`,
  };
  
  

  top.js

  // pages/top/top.js
  
  import URL from '../../utils/api';
  import {
        
         request } from '../../utils/util';
  Page({
        
        
    /**
     * 页面的初始数据
     */
    data: {
        
        
      limit: 10,
      offset: 0,
      artList: [],
  
      isPage: true,
    },
  
    onLoad: function (options) {
        
        
      this.getArtList();
    },
  
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {
        
        
      console.log('用户下拉了');
    },
  
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {
        
        
      const {
        
         isPage } = this.data;
  
      //如果没有更多数据，则停止下拉加载事件
      if (isPage) {
        
        
        this.setData({
        
         offset: (this.data.offset += 1) });
        wx.showNavigationBarLoading();
  
        this.getArtList();
      }
    },
  
    //获取列表数据
    async getArtList() {
        
        
      const {
        
         limit, offset } = this.data;
      const {
        
        
        data: {
        
         artists, code, more },
      } = await request(URL.artList, {
        
         type: -1, limit: limit, offset: offset }, 'get');
  
      if (code == 200) {
        
        
        //如果没有更多，则停止
        if (!more) {
        
        
          this.setData({
        
         isPage: false });
        }
  
        this.setData({
        
         artList: this.data.artList.concat(artists) });
        wx.hideNavigationBarLoading();
      }
    },
  });