>>跟着b站up主“咸虾米_”学习微信小程序开发中，把学习记录存到这方便后续查找。
课程连接：4.10.【小案例】触底加载更多数据onReachBottom_哔哩哔哩_bilibili
一、wx.js中相应部分修改如下代码
Page({
/**
* 页面的初始数据
*/
data: {
listArr:[]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
wx.showLoading({
title: '加载中',
mask:true
})
this.setData({
listArr:[]
})
this.getData();
},
//获取随即猫咪网络请求
getData(){
wx.request({
url: 'https://api.thecatapi.com/v1/images/search?limit=2',
success:res=>{
console.log(res.data);
let oldData=this.data.listArr;
let newData=oldData.concat(res.data) //用concat拼接数据
this.setData({
listArr:newData
})
wx.stopPullDownRefresh() //正常请求完数据之后，就停止显示下拉刷新。
//wx.hideLoading() //正常请求完数据之后，就停止显示加载中
},
complete:err=>{ //无论请求成功还是失败，都停止显示加载中
wx.hideLoading()
wx.hideNavigationBarLoading()
}
})
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
this.setData({ //先清空，再获取新的数据
listArr:[]
})
this.getData();
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
wx.showNavigationBarLoading();
this.getData();
},
})onReachBottom()，触底后执行的函数，导航栏会显示loading，调用getData来加载新数据，而getData()中，用oldData保存旧数组内容，newData保存旧数据加上新读取的10条数据，然后把newData赋值给listArr数组。如此一来，触底后会继续往下加载新的数据，而已加载的数据保持不变。
此时如果下拉刷新，页面只会显示10条，因为在onPullDownRefresh(){}中，一开始就先将数组清空再读取数据了，所以只有10条。
二、其他文件内容和前两篇一样
三、结果
触底几次后，有40组数据
刚下拉刷新时，数组清空
读取数据后，有10组数据
