uni-app 下拉刷新

在UniApp中实现下拉刷新功能，你可以按照以下步骤操作：

1. **启用下拉刷新**：首先，在`pages.json`文件中，找到需要设置下拉刷新页面的配置。例如，在"document/officialDocument"页面，添加或更新`enablePullDownRefresh`属性，使其值为`true`以启用下拉刷新，如引用[2]所示：

   {
     "path": "pages/PMS/document/officialDocument",
     "style": {
       "navigationStyle": "custom",
       "enablePullDownRefresh": true, // 启用下拉刷新
       "onReachBottomDistance": 100 // 设置下拉到底部的距离（可选，默认为0）
     }
   },

2. **调用下拉刷新事件**：在相应的页面组件中，当数据需要从服务器更新时，你可以通过`uni.startPullDownRefresh()`方法来触发下拉刷新。这个方法会自动执行下拉刷新动画，让用户感知到新的数据请求即将发生[^1]。

   export default {
     data() {
       return {
         refreshing: false, // 初始化刷新状态为false
       };
     },
     methods: {
       refreshData() {
         this.refreshing = true; // 开始刷新
         setTimeout(() => {
           // 假设这里是异步数据请求
           // 模拟数据加载完成
           this.$refs.refresh.finishPullDownRefresh(); // 数据加载完成后结束刷新
           this.refreshing = false;
         }, 2000);
       },
     },
     onReady() {
       this.$refs.refresh.startPullDownRefresh(); // 页面加载完成后立即调用下拉刷新
     },
   };

3. **监听刷新状态**：在方法中管理刷新状态，通常会在数据加载完成后调用`finishPullDownRefresh()`停止刷新。如果需要在实际项目中处理复杂情况，可能还需要监听`refreshing`状态的变化。

这样就实现了 UniApp 中的下拉刷新功能，用户可以通过快速向下拉动屏幕来触发数据更新。