美文网首页
vue自定义指令

vue自定义指令

作者: 海豚先生的博客 | 来源:发表于2022-10-23 14:42 被阅读0次

    防抖

    Vue.directive('throttle', {
      bind: (el, binding) => {
        // 防抖时间
        let throttleTime = binding.value; 
        if (!throttleTime) {
          throttleTime = 2000;
        }
        let cbFun;
        el.addEventListener('click', event => {
          if (!cbFun) {
            cbFun = setTimeout(() => {
              cbFun = null;
            }, throttleTime);
          } else {
            event && event.stopImmediatePropagation();
          }
        }, true);
      },
    });
    // 为button标签设置v-throttle自定义指令
    <button @click="sayHello" v-throttle>提交</button>
    

    相关文章

      网友评论

          本文标题:vue自定义指令

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