zoukankan      html  css  js  c++  java
  • 小程序节流函数,防止多次点击

    在util.js里加入

    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
            }
        }
    }
    module.exports = {
    throttle: throttle,
    //formatTime: formatTime
    }

    在引入页面,加入到顶部,引入函数

    // pages/zhanbuView/zhanbuView.js
    const util = require('../../utils/util.js')
    Page({
    
      /**
       * 页面的初始数据
       */
      data: {

    在功能调用的地方,例如:

    <button bindtap='tap' data-key='abc'>tap</button>
    const util = require('../../utils/util.js')
     
    Page({
        data: {
            text: 'tomfriwel'
        },
        onLoad: function (options) {
     
        },
        tap: util.throttle(function (e) {
            console.log(this)
            console.log(e)
            console.log((new Date()).getSeconds())
        }, 1000)
    })

    实例:

    zhanbuView:util.throttle(function(e){
        
        wx.request({
          
          url: 'https://wwwx.xxxx.xx/Wx/zhanbuView',
          data:{
            yaoId:e.target.dataset.yao,
            author:e.target.dataset.author,
            
          },
          header:{
            'content-type':'application/x-www-form-urlencoded'
          },
          success:(res)=>{
    
            const app = getApp();
           
                app.globalData.zhanbuViewAuthor=res.data.zhouyiAuthor.name;
                app.globalData.zhanbuViewAuthorInfo=res.data.zhouyiAuthor.info,
              
                app.globalData.zhanbuViewContent=res.data.content,
                app.globalData.zhanbuViewXiang=res.data.xiang,
                //timeline
                app.globalData.zhanbuViewYaoId=res.data.zhouyiYao.id,
             //   console.log(app.globalData.zhanbuViewYaoId),
              //  console.log(app.globalData),
               // console.log(app.globalData.zhanbuYao.data.yaoId),
                wx.redirectTo({
                
                  url: '../zhanbuView/zhanbuView',
                 
                })
        
        
          }
        })
        //function end 节流函数
          },1500),

    实测,好用。

  • 相关阅读:
    BZOJ2253: [2010 Beijing wc]纸箱堆叠
    解题:CF1055F Tree and XOR
    解题:JSOI 2011 柠檬
    解题:NOI 2009 诗人小G
    2019.2.28&2019.3.1 考试
    省选前作业题汇总2
    解题:LNOI 2014 LCA
    省选前作业题汇总1
    2019.2.26 考试
    解题:SDOI 2014 重建
  • 原文地址:https://www.cnblogs.com/sdgtxuyong/p/13773012.html
Copyright © 2011-2022 走看看