微信小程序返回上一页面的时候 上一页面会重新加载吗

微信小程序默认情况下，返回上一页面时不会重新加载。上一页面会从缓存中获取，因此可以快速加载页面，提高用户体验。但是，在某些情况下，如果在上一页面中使用了onShow生命周期函数，或者在onLoad生命周期函数中使用了网络请求等操作，返回上一页面时会重新执行这些操作，导致页面重新加载。此时可以使用页面栈的相关API来控制页面的跳转和缓存情况，从而达到我们想要的效果。

相关问题

微信小程序 上拉加载

### 微信小程序实现上拉加载更多数据功能

在微信小程序中，`onReachBottom` 生命周期函数用于检测页面是否滚动到了底部。当用户滚动至页面最底端时会触发此事件，从而可以用来请求并展示更多数据[^1]。

#### 配置 `onReachBottomDistance`

为了优化用户体验，在距离页面真正触底前就提前触发加载操作，可以在 `json` 文件里设置 `onReachBottomDistance` 参数来定义触发距离。例如：

{
  "usingComponents": {},
  "onReachBottomDistance": 50
}

上述配置表示当页面剩余未显示的内容高度小于等于50px时即触发 `onReachBottom` 函数调用[^2]。

#### JavaScript逻辑处理

下面是一段简化版的JavaScript代码片段，展示了如何利用 `onReachBottom()` 方法获取新一批商品列表项，并更新视图层的数据绑定变量以追加新的条目到现有列表之中。

Page({
  data: {
    goodsList: [], // 存储已有的商品信息数组
    page: 1,       // 当前页码，默认第一页
    hasMoreData: true // 是否还有更多数据可加载标志位
  },

  onLoad() {
    this.fetchGoods();
  },

  onReachBottom() {
    if (!this.data.hasMoreData) return;
    
    console.log('尝试加载下一页');
    this.setData({page: this.data.page + 1});
    this.fetchGoods();
  },

  fetchGoods() {
    wx.request({
      url: 'https://example.com/api/goods', // 请求接口地址
      method: 'GET',
      data: {page: this.data.page},
      success(res){
        const newData = res.data.list || [];
        
        if (newData.length === 0) {
          this.setData({hasMoreData: false});
          return;
        }

        this.setData({
          goodsList: [...this.data.goodsList, ...newData]
        });
      }
    })
  }
})

这段脚本首先初始化了一个空的商品列表以及当前查询起始位置（默认为第一页）。每当页面初次载入或是达到底部时都会发起一次网络请求去服务器端取回指定数量的新记录；如果返回为空，则停止继续尝试加载后续分页内容。

微信小程序上拉加载onReachBottom

微信小程序中的onReachBottom事件可以用来实现上拉加载功能，当页面滚动到底部时，该事件会被触发。你可以在该事件中发送请求，获取更多的数据并渲染到页面上。

具体实现方法如下：

1. 在页面的json文件中，将onReachBottom事件声明为页面的事件之一：

{
  "usingComponents": {},
  "enablePullDownRefresh": true,
  "navigationBarTitleText": "示例页面",
  "onReachBottom": "onReachBottom"
}

2. 在页面的js文件中，编写onReachBottom事件的处理函数，该函数会在页面滚动到底部时被触发：

Page({
  data: {
    dataList: [],   // 数据列表
    pageNum: 1,     // 当前页数
    pageSize: 10,   // 每页显示的数据条数
    hasMoreData: true  // 是否还有更多数据
  },
  // 上拉加载更多
  onReachBottom: function () {
    if (this.data.hasMoreData) {
      this.loadData(this.data.pageNum + 1)
    }
  },
  // 加载数据
  loadData: function (pageNum) {
    wx.showLoading({
      title: '加载中'
    })
    wx.request({
      url: 'https://xxx.com/api/data',  // 请求接口地址
      data: {
        pageNum: pageNum,
        pageSize: this.data.pageSize
      },
      success: res => {
        wx.hideLoading()
        if (res.data.code === 0) {
          let dataList = this.data.dataList.concat(res.data.data)
          this.setData({
            dataList: dataList,
            pageNum: pageNum,
            hasMoreData: dataList.length < res.data.totalCount ? true : false
          })
        } else {
          wx.showToast({
            title: '加载失败',
            icon: 'none'
          })
        }
      },
      fail: err => {
        wx.hideLoading()
        wx.showToast({
          title: '加载失败',
          icon: 'none'
        })
      }
    })
  }
})

在上述代码中，loadData函数用于获取数据并渲染到页面，同时更新页码和是否还有更多数据的状态。onReachBottom事件中调用loadData函数，传入当前页码加1的值，以获取下一页的数据。

另外，如果后端返回的数据中包含总数据量，我们可以通过比较当前列表的数据数量和总数据量来判断是否还有更多数据，从而控制是否继续加载。