防止多次点击,vue的按钮上做简易的防抖节流处理

话不多说,上个视频,看看是不是你要的效果

防抖节流

1.创建一个directive.js

// directive.js
export default {install(Vue) {// 防重复点击(指令实现)Vue.directive('repeatClick', {inserted(el, binding) {el.addEventListener('click', () => {if (!el.disabled) {el.disabled = truesetTimeout(() => {el.disabled = false}, binding.value || 1000)}})}})}
}

2.引入到main.js

import directive from './utils/directive.js'; //防止多次点击事件Vue.use(directive);

3.使用:

<template slot-scope="scope"><el-button  v-repeatClick='3000' type="primary" size="mini" @click="sub(scope.row)">插入</el-button></template>

注意,这个只能放在按钮上

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/360180.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

我对ChatGPT-5的期待

在科技飞速发展的今天&#xff0c;人工智能&#xff08;AI&#xff09;已经成为我们生活中不可或缺的一部分。尤其是近年来&#xff0c;随着ChatGPT等先进AI模型的推出&#xff0c;我们见证了AI技术在智能水平上的巨大飞跃。作为这一领域的最新成果&#xff0c;GPT-5的即将发布…

电脑开机后出现Aptio Setup Utility 处理方法

电脑开机后出现Aptio Setup Utility怎么处理 Aptio Setup Utility界面的原因&#xff1a; 这是由于 bios设置与真实的硬件情况不匹配硬盘故障找不到可启动的硬盘情况 我的问题是找不到可启动的硬盘情况 解决方式如下&#xff1a; 进入如下界面了&#xff0c;选择Boot选项…

yolov10--C#接口

一、前言 本章主要讲解yolov10的C#接口&#xff0c;主要是使用微软开发的openvinocsharp工具加载yolov10模型&#xff0c;并做推理。 二、yolov10模型转换 这里为了演示&#xff0c;使用官方yolov10m模型&#xff08;其他大小的模型同理&#xff09;做演示&#xff0c;可从下方…

动态规划数字三角形模型——AcWing 275. 传纸条

动态规划数字三角形模型 定义 动态规划数字三角形模型是在一个三角形的数阵中&#xff0c;通过一定规则找到从顶部到底部的最优路径或最优值。 运用情况 通常用于解决具有递推关系、需要在不同路径中做出选择以达到最优结果的问题。比如计算最短路径、最大和等。 计算其他…

服务器数据恢复—NTFS文件系统下双循环riad5数据恢复案例

服务器存储数据恢复环境&#xff1a; EMC CX4-480存储&#xff0c;该存储中有10块硬盘&#xff0c;其中有3块磁盘为掉线磁盘&#xff0c;另外7块磁盘组成一组RAID5磁盘阵列。运维人员在处理掉线磁盘时只添加新的硬盘做rebuild&#xff0c;并没有将掉线的硬盘拔掉&#xff0c;所…

重点!业内分享:如何找到自己门店的生鲜经营定位

说到经营生鲜品类 许多商超人士或许都会面临这样一个困境 即品类繁多且复杂&#xff0c;那么如何做到精准施策&#xff1f; 比如说&#xff0c;蔬菜和水果虽都归为生鲜&#xff0c;然而细分起来&#xff0c;价格和消费群体均存在差异。像蔬菜&#xff0c;价格通常较低&#…

docker入门配置

1、创建配置镜像 由于国内docker连接外网速度慢&#xff0c;采用代理 vi /etc/docker/daemon.json添加以下内容 {"registry-mirrors": ["https://9cpn8tt6.mirror.aliyuncs.com","https://dockerproxy.com","https://hub-mirror.c.163.co…

Python开发日记--手撸加解密小工具(2)

目录 1. UI设计和代码生成 2.运行代码查看效果 3.小结 1. UI设计和代码生成 昨天讨论到每一类算法设计为一个Tab&#xff0c;利用的是TabWidget&#xff0c;那么接下来就要在每个Tab里设计算法必要的参数了&#xff0c;这里我们会用到组件有Label、PushButton、TextEdit、Ra…

第4讲:pixi.js绘制舞台、随窗口大小而改变画布大小和舞台位置

基于前面写的代码&#xff0c;在gamelets的工程目录下新建一个CanvasAndStage.ts 代码如下 import {Application, Graphics} from pixi.js; // 不要忘了&#xff0c;一定要引用这个css样式&#xff0c;否则就会以默认样式显示 import ./style.css // app.view就是画布&#xf…

使用JAVA代码实现发送订阅消息以及模板消息

今天写了一个商品到货提醒的job任务&#xff0c;具体效果如下 这里用到了微信的发送订阅消息&#xff0c;主要代码是这一块的&#xff0c;最后我把发送了消息的订单存到表里&#xff0c;因为是定时任务&#xff0c;大家可不存 发送订阅消息 | 微信开放文档 /*** 微信平台-商品…

<电力行业> - 《第1课:电力行业的五大四小》

1 什么是电力行业的五大四小&#xff1f; 我们常说的电力行业的五大四小&#xff0c;指的是电力行业有实力的公司&#xff0c;分为&#xff1a;较强梯队的五大集团、较弱梯队的四小豪门。 五个实力雄厚的集团&#xff0c;分别是&#xff1a; 中国华能集团公司中国大唐集团公…

公交行业系统特点及面临的挑战

在当前城市发展中&#xff0c;公交行业作为公共交通的重要组成部分&#xff0c;承担着重要的社会责任。随着科技的进步和城市化进程的加快&#xff0c;公交行业系统也在不断地发展和完善。然而&#xff0c;从目前的发展情况来看&#xff0c;公交行业系统也呈现出一些显著的特点…

怎么加密文件夹?文件夹加密软件推荐

文件夹加密是保护电脑数据的重要方法&#xff0c;那么你知道怎么加密文件夹吗&#xff1f;下面小编就为大家推荐两款文件夹加密软件&#xff0c;帮助你安全保护重要文件夹。 文件夹加密超级大师 在加密电脑文件夹时&#xff0c;文件夹加密超级大师是你必须要了解的文件夹加密软…

uniapp顶部导航栏实现自定义功能按钮+搜索框并监听响应事件

目录 第一步&#xff1a;先下载按钮需要展示的图标&#xff08;若不使用图标&#xff0c;直接使用文字可跳过这步&#xff09; 1、点击需要的图标&#xff0c;添加入库 2、点击旁边的购物车&#xff0c;在弹出的窗口中选择下载代码 3、解压下载的压缩包&#xff0c;将这几个…

鸿蒙 HarmonyOS NEXT星河版APP应用开发-阶段二

一、鸿蒙应用界面开发 弹性布局-Flex 语法 /* 弹性容器组件 Flex() 位置&#xff1a; Flex默认主轴水平往右&#xff0c;交叉轴垂直向下&#xff08;类似Row&#xff09; 语法&#xff1a; Flex(参数对象){子组件1,子组件2,子组件3 } 属性方法&#xff1a; direction&#xf…

Hi3861 OpenHarmony嵌入式应用入门--轮询按键

本篇介绍使用轮询方式读取gpio状态来判断按键状态。 原理图如下 GPIO API API名称 说明 hi_u32 hi_gpio_init(hi_void); GPIO模块初始化 hi_u32 hi_io_set_pull(hi_io_name id, hi_io_pull val); 设置某个IO上下拉功能。 hi_u32 hi_gpio_set_dir(hi_gpio_idx id, hi_gpi…

达梦数据库(DM8)替换授权dm.key遇到的错误, lic info is different between dm.key and sysinfo.

1、报错贴图 2、报错日志提示 version info: security lic info is different between dm.key and sysinfo. 原因说明&#xff1a;dm.key授权与服务器的硬件环境不匹配引起的报错&#xff0c;如&#xff1a;cpu、操作系统版本有关。

高通安卓12-安卓系统定制2

将开机动画打包到system.img里面 在目录device->qcom下面 有lito和qssi两个文件夹 现在通过QSSI的方式创建开机动画&#xff0c;LITO方式是一样的 首先加入自己的开机动画&#xff0c;制作过程看前面的部分 打开qssi.mk文件&#xff0c;在文件的最后加入内容 PRODUCT_CO…

嘀嗒出行项目管理专家和项目管理负责人王禹华受邀为第十三届中国PMO大会演讲嘉宾

全国PMO专业人士年度盛会 嘀嗒出行项目管理专家和项目管理负责人王禹华女士受邀为第十三届中国PMO大会演讲嘉宾&#xff0c;演讲议题为“AI时代项目经理挑战机会和个人成长”。大会将于6月29-30日在北京举办&#xff0c;敬请关注&#xff01; 议题简要&#xff1a; AI时代对互…

智能雷达在线编辑名片小程序源码系统 前后端分离 带完整的安装代码包以及搭建教程

系统概述 智能雷达在线编辑名片小程序源码系统是一款集创新性、实用性和便捷性于一体的工具。它采用前后端分离的架构&#xff0c;为用户提供了一个强大的平台&#xff0c;可用于创建、编辑和管理个性化名片。 该系统旨在满足现代商业和社交需求&#xff0c;提供了一种高效、…