微信小程序云数据库触底分页加载，极简代码之云开发的触底无限加载

触底无限加载的简单的代码。

js:

const db = wx.cloud.database()
const _ = db.command
const col = "test"
const sql = {
   
  _id: _.neq(1)
} //获取所有记录

Page({
   

  data: {
   
    isEndOfList: false,
    list: [],
    limit: 20 //每次拉取数量
  },

  onLoad: function(options) {
   
    this.getData()
  },

  getData: function() {
   
    db.collection(col)
      .where(sql)
      .skip(this.data.list.length)
      .limit(this.data.limit)
      .get()
      .then(res => {
   
        this.setData({
   
          list: [...this.data.list, ...res.data], //合并数据
          isEndOfList: res.data.length < this.data.limit ? true : false //判断是否结束
        })
      })
  },

  onReachBottom: function() {
   
    !this.data.isEndOfList && this.getData()
  }
})

wxml

<view style="height:100px" wx:for='{
    {list}}' wx:key='none'>{
  {index}}</view>
<view style="padding:15px;text-align:center;color:grey" wx:if='{
    {list.length>limit}}'>
  <view wx:if='{
    {(!isEndOfList)}}'>正在加载数据...</view>
  <view wx:else>----END----</view>
</view>