美文网首页
双击666-doubleclick高阶函数封装

双击666-doubleclick高阶函数封装

作者: TOPro | 来源:发表于2018-04-03 09:28 被阅读15次

    封装

    stop,prevent关键字还未封装

    function dbclick(callback,stop,prevent){
      const duration = 300;
      var _rec,_timeout;
      function clear(){
        _rec=null;
        clearTimeout(_timeout);
        _timeout=null;
      }
      return function(){
        let now = new Date()*1;
        if(_rec){
          if(now-_rec<duration*1000){
            callback.apply(this,arguments);
            clear()
          }
        }else{
          clear();
          _rec = now;
          _timeout = setTimeout($clear,duration)
        }
      }
    }
    

    举例

    var vm = new Vue({
      el:"#root",
      template:`<div @click="beclick">nihao</div>`,
      methods:{
        beclick:dbclick(function(e){
          //这里响应双击
          alert();
        })
      }
    })
    

    相关文章

      网友评论

          本文标题:双击666-doubleclick高阶函数封装

          本文链接:https://www.haomeiwen.com/subject/xxcqhftx.html