微信小程序笔记 云开发 云函数 触底加载新数据

wxml：

<view class="row" wx:for="{{recordList}}" wx:key="index">
  <view class="title">Name：{{item.buyerName}}</view>
  <view>phone：{{item.buyerPhone}}</view>
</view>

wxss：

.row{
  margin: 100rpx;
}

.row view{
  height: 150rpx;
}

js：

Page({

  data: {
    recordList:[]
  },

  getData(dataBaseName = "buyerBasics", skipNumber = 0, needNumber = 3){
    wx.cloud.callFunction({
      name:"getDataFromDatabase",
      data:{
        databaseName:dataBaseName,
        skipNumber:skipNumber,
        needNumber:needNumber
      }
    })
    .then(res=>{
      console.log(res.result.data)

      var oldRecordList = this.data.recordList
      var newRecordList = oldRecordList.concat(res.result.data)
      this.setData({
        recordList:newRecordList
      })
    })
  },

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

  onReachBottom: function () {
    this.getData("buyerBasics",this.data.recordList.length,3)
  }
})

云函数js：

// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()
const db = cloud.database()

// 云函数入口函数

// 参数：
// databaseName:   数据库的名称
// skipNumber：    跳过前skipNumber条记录
// needNumber：    取回needNumber条记录

exports.main = async (event, context) => {
  var databaseName = event.databaseName
  var skipNumber = Number(event.skipNumber)
  var needNumber = Number(event.needNumber)

  return await db.collection(databaseName).skip(skipNumber).limit(needNumber).get()
}

前端效果图：

后端运行结果：