当前位置：首页 > wzjs >正文

免费做简易网站百度推广收费

wzjs 2025/7/26 7:17:02

免费做简易网站,百度推广收费,做嗳啪啪网站,怎样做可以互动留言的网站下拉刷新时小程序中常见的一种刷新方式，当用户下拉页面的时候，页面会自动刷新，以便用户获取最新的内容； 小程序中实现下拉刷新的方式： 在 app.json 或者 page.json 中开启允许下拉，同时可以配置窗口、loa…

下拉刷新时小程序中常见的一种刷新方式，当用户下拉页面的时候，页面会自动刷新，以便用户获取最新的内容；

小程序中实现下拉刷新的方式：

在 app.json 或者 page.json 中开启允许下拉，同时可以配置窗口、loading 样式等；
在页面.js 中定义 onPullDownRefresh 事件监听用户下拉刷新；

下面打开微信开发者工具来配置一下下拉刷新功能：

在 pages/cate/cate.json 中配置允许下拉：
```
{"usingComponents": {},"onReachBottomDistance": 100,"enablePullDownRefresh": true,"backgroundColor": "#efefef","backgroundTextStyle": "light" 
}
```
点击编译，下拉页面，可以看到页面允许下拉，下拉窗口背景颜色为 #efefef，下拉窗口 loading 颜色为 light，如下：
在 pages/cate/cate.js 中定义一个下拉刷新事件处理函数，如下所示：
```
  // 监听用户下拉刷新onPullDownRefresh(){console.log("监听用户下拉刷新")}
})
```
点击编译，下拉页面，可以看到 Console 区域打印了对应的信息，如下所示：

结合上一节（小程序API —— 55页面处理函数 -上拉加载）内容，实现下面的需求：当用户上拉加载更多以后，如果用户进行下拉刷新，需要将数据重置：

在 pages/cate/cate.js 中添加对应的刷新逻辑，如下所示：

  // 监听用户下拉刷新onPullDownRefresh(){// console.log("监听用户下拉刷新")// 当用户上拉加载更多以后，如果用户进行了下拉刷新，需要将数据进行重置this.setData({numList: [1, 2, 3]})// 下拉刷新以后，loading 效果有可能不会弹回去if(this.data.numList.length === 3){wx.stopPullDownRefresh()}}