Parcourir la source

自定义指令添加,密码功能升级

asd26269546 il y a 1 an
Parent
commit
f6d417cf76

+ 1 - 1
src/components/byTable/index.vue

@@ -128,7 +128,7 @@
           type="primary"
           style="margin-left: 10px"
           size="default"
-          @click="searchFn"
+          v-no-double-click="searchFn"
           >{{ $t("common.search") }}</el-button
         >
         <div

+ 2 - 0
src/directive/index.js

@@ -2,10 +2,12 @@ import hasRole from './permission/hasRole'
 import hasPermi from './permission/hasPermi'
 import copyText from './common/copyText'
 import mousewheel from './permission/mousewheel'
+import noDoubleClick from './permission/noDoubleClick'
 
 export default function directive(app){
   app.directive('hasRole', hasRole)
   app.directive('hasPermi', hasPermi)
   app.directive('copyText', copyText)
   app.directive('mousewheel', mousewheel)
+  app.directive('noDoubleClick', noDoubleClick)
 }

+ 51 - 0
src/directive/permission/noDoubleClick.js

@@ -0,0 +1,51 @@
+// 自定义指令定义  
+{/* demo <div v-no-double-click="myMethod">Click me</div>   */ }
+
+export default {
+    mounted(el, binding, vnode) {
+        // 记录上一次点击的时间  
+        let lastClickTime = 0;
+
+        // 监听元素的点击事件  
+        el.addEventListener('click', function (event) {
+            console.log(lastClickTime)
+            if(lastClickTime == 0){
+                binding.value(event);
+                lastClickTime = Date.now();
+            }else{
+                // 获取当前时间戳  
+                let currentTime = Date.now();
+                // 定义禁止连续点击的时间间隔(以毫秒为单位)  
+                const doubleClickInterval = 500;
+                // 检查是否在禁止的时间间隔内进行了连续点击  
+                if (currentTime - lastClickTime > doubleClickInterval) {
+                    // 阻止默认行为  
+                    event.preventDefault();
+                    binding.value(event);
+                    // 更新上一次点击的时间戳
+                    lastClickTime = currentTime;
+                }
+            }
+            
+        });
+        // let clickTimer;
+        // console.log(el, binding, vnode)
+        // console.log('v-no-double-click mounted')
+        // el.addEventListener('click', function (event) {
+        //     if (clickTimer) {
+        //         // 如果上一次点击的计时器还存在,则取消计时器并阻止连续点击  
+        //         clearTimeout(clickTimer);
+        //     }
+
+        //     // 创建一个延迟执行的函数,以防止连续点击  
+        //     clickTimer = setTimeout(() => {
+        //         binding.value(event)
+        //     }, 200); // 设置延迟时间(毫秒)  
+        // });
+    },
+    // 在元素被插入到 DOM 中时被调用  
+    inserted: function (el, binding, vnode) {
+        
+    }
+
+}