微信小程序延迟显示按钮

可控制延迟显雀缓示的微信小程序 loading 组件，默认请求超过0.5s才显示loading动画；支持 slot 自定义 loading 内容。

在项目中，若网络良好的情况下，每次请求都显示loading动画，会导致页面短时间内频繁闪现loading动画，用户体验不佳。本组件搭岁指可自定义loading组件显示延时，只有当请求超过设置的时间未完成时，才显示loading动画，减少loading动画出现的次知配数。

1，

小程序有提供一个下拉刷新的功能2，点击按钮重新加载页面没有任何意义，因为如果你锋锋稿要改变页面显示数据，可以直接（请求接口）改变data数据他会自动重新加载，或者重新调用onLoad里面的方法（一般我们基笑把请求数据都放在onLoad里面），不会像网页那样需要刷新页面3，如果你硬是要那种效果你可银孝以用页面跳转api跳转到当前页面wx.switchTab({url:当前路径})

目前总结解决方法：同时需要设置模块拆猜的函数，函数都可放置在util.js中去。

首先：

一、在util.js中放卜运入如下两组函数

1. 设置点击后多久不能再次 *** 作该

function throttle(fn, gapTime) {

  if (gapTime == null || gapTime == undefined) {

    gapTime = 1500

  }

  let _lastTime = null

  // 返回新的函数

  return function () {

    let _nowTime = + new Date()

    if (_nowTime - _lastTime >gapTime || !_lastTime) {

      fn.apply(this, arguments)  //将this和参数传给原函数

      _lastTime = _nowTime

    }

  }

}

2. 设置加载动画

function showLoading(message) {

  if (wx.showLoading) {    // 基础库 1.1.0 微信6.5.6版本开始支持，低版本需做兼容处理

    wx.showLoading({

      title: message, mask: true

    })

  } else {    // 低版本型御梁采用Toast兼容处理并将时间设为20秒以免自动消失

    wx.showToast({

      title: message, icon: 'loading', mask: true, duration: 20000

    })

  }

}

function hideLoading() {

  if (wx.hideLoading) {    // 基础库 1.1.0 微信6.5.6版本开始支持，低版本需做兼容处理

    wx.hideLoading()

  } else {

    wx.hideToast()

  }

}

并且将其导出作为页面使用：

module.exports = {

  throttle: throttle,

  showLoading: showLoading,

  hideLoading: hideLoading,

}

二、将函数引入页面使用

const util = require('../../utils/util.js')

即可。

---