微信小程序基础篇 -- 全局配置 -- window - 下拉刷新 & 上拉触底（十六）
大家好，又见面了，我是夜阑的狗。本文是专栏【微信小程序开发教程】专栏的第16篇文章。今天开始学习微信小程序的第九天，开启新的征程，记录最美好的时刻，每天进步一点点。
前言
在上一篇文章中，我们讲到了如何使用 `window` 对象来获取当前页面的信息。在这一篇文章中，我们将继续讨论 `window` 对象的其他方面，特别是关于下拉刷新和上拉触底的实现。
下拉刷新
下拉刷新是一种常见的交互方式，用户可以通过向下拉动页面来刷新当前页面的内容。我们如何在微信小程序中实现这种效果呢？
首先，我们需要在 `app.json` 文件中配置一个全局变量 `window.onPullDownRefresh`，如下所示：
```json{
"pages": [
"index/index",
"logs/logs"
],
"window": {
"onPullDownRefresh": true }
}
```
然后，我们需要在页面的 `onLoad` 方法中添加一个事件监听器来捕捉下拉刷新事件：
```javascriptPage({
onLoad: function(options) {
// ...
wx.onPullDownRefresh(() => {
console.log('下拉刷新');
// 在这里实现下拉刷新逻辑 });
}
});
```
在上面的代码中，我们使用 `wx.onPullDownRefresh` 方法来监听下拉刷新事件，当用户向下拉动页面时，会触发这个事件。我们可以在这里实现下拉刷新的逻辑。
上拉触底
上拉触底是一种常见的交互方式，用户可以通过向上拉动页面来触发当前页面的内容。我们如何在微信小程序中实现这种效果呢？
首先，我们需要在 `app.json` 文件中配置一个全局变量 `window.onReachBottomSide`,如下所示：
```json{
"pages": [
"index/index",
"logs/logs"
],
"window": {
"onReachBottomSide": true }
}
```
然后，我们需要在页面的 `onLoad` 方法中添加一个事件监听器来捕捉上拉触底事件：
```javascriptPage({
onLoad: function(options) {
// ...
wx.onReachBottomSide(() => {
console.log('上拉触底');
// 在这里实现上拉触底逻辑 });
}
});
```
在上面的代码中，我们使用 `wx.onReachBottomSide` 方法来监听上拉触底事件，当用户向上拉动页面时，会触发这个事件。我们可以在这里实现上拉触底的逻辑。
总结
本篇文章讲到了如何在微信小程序中实现下拉刷新和上拉触底的效果。通过配置全局变量 `window.onPullDownRefresh` 和 `window.onReachBottomSide`,以及添加事件监听器来捕捉这些事件，我们可以轻松地实现这些交互方式。
参考资料
* 微信小程序官方文档： 微信小程序开发教程：
