uni-app实现下拉刷新

1：在项目的根目录打开page.json,找到对应的页面，在下面添加

 {
      "path": "goods_list/goods_list",
      "style": {
        "navigationBarTitleText": "商品列表",
         
        //开启下拉刷新
        "enablePullDownRefresh": true,
        //当前窗口的背景颜色
        "backgroundColor": "#F8F8F8",
        "onReachBottomDistance": 150
      }
    },

2：在对应页面监听enablePullDownRefresh事件，与methods平级监听onPullDownRefresh

    //下拉刷新
    onPullDownRefresh(){
      //重置关键数据

      //重置页码值
      this.queryObj.pagenum = 1
      //重置总数
      this.total = 0
      //重置节流阀
      this.isloading = false
      //重置商品列表信息
      this.goodsList = []
      
      //重新发起请求：请求发送成功以后传入一个回调函数，回调函数停止下拉刷新
      this.getGoodsList(() => uni.stopPullDownRefresh())
    }

3：改造getGoodsList 函数，接收回调函数

    methods: {
      async getGoodsList(cb) {
        //开启节流阀
        this.isLoading = true      
        const {data: res} = await uni.$http.get('******', this.queryObj)
        if (res.meta.status !== 200) {
          return uni.$showMsg()
        }
        console.log(res)
        //请求完成，关闭节流阀
        this.isLoading = false
        // 只要数据请求完毕，就立即按需调用 cb 回调函数
        cb && cb()
        
        // 为数据赋值
        //上拉加載更多，，定义一个新数组，将旧数组展开，再将旧数组展开
        this.goodsList = [...this.goodsList , ...res.message.goods] 
        this.total = res.message.total      
       
      }
    },