当前位置: 首页 > news >正文

vue3提交按钮限制重复点击

下载lodash

npm install lodash

引入并使用

<template><div @click="submit()">提交</div>
</template><script setup>import { debounce } from 'lodash';const submit = debounce(() => {//业务代码},2000,{leading: true,trailing: false})
</script>

lodash中引入debounce函数,leading和trailing是配置布尔值。leading为true的时候是先触发业务代码,2000ms内不再触发,默认为false。trailing为true是默认值,代表点击按钮2000ms后再出发业务代码

debounce防抖:适合用于提交表单、搜索、输入框输入、窗口调整事件

案例

http://www.lryc.cn/news/437975.html

相关文章:

  • Java | Leetcode Java题解之第395题至少有K个重复字符的最长子串
  • 20240915 每日AI必读资讯
  • 量化交易需要注意的关于股票交易挂单排队规则的问题
  • 应急响应实战---是谁修改了我的密码?
  • 知识的通用性
  • 36岁,大厂女程序员,中年失业后,我开始接受自己的平凡,并深耕自己
  • shader 案例学习笔记之mix函数
  • OpenAI草莓正式发布,命名o1
  • 心觉:以终为始,帮你精准实现目标
  • 【Kubernetes】linux centos安装部署Kubernetes集群
  • canlog-vci can记录仪,速采仪如何用VBDSP进行解析曲线
  • JCO|病理AI是精准医疗的未来吗?|个人观点·24-09-13
  • idea一键自动化部署项目
  • Mybatis-plus复习篇
  • Leetcode 109.有序链表转换二叉搜索树(Medium)
  • [数据集][目标检测]河道垃圾检测数据集VOC+YOLO格式2274张8类别
  • python vtk 绘制圆柱体和包围盒
  • Fisco Bcos 2.11.0通过网络和本地二进制文件搭建单机节点联盟链网络(搭建你的第一个区块链网络)
  • 【Canvas与表盘】绘制黄蓝两色简约表盘
  • 大数据-128 - Flink 并行度设置 细节详解 全局、作业、算子、Slot
  • 图新地球-将地图上大量的地标点批量输出坐标到csv文件【kml转excel】
  • Git提交有乱码
  • leetcode hot100_part4_子串
  • Spring Cloud之三 网关 Gateway
  • Linux 进程1
  • LeetCode: 2552. 统计上升四元组 动态规划 时间复杂度O(n*n)
  • Unity 编辑器设置中文
  • springboot-创建连接池
  • matlab绘制不同区域不同色彩的图,并显示数据(代码)
  • Docker Desktop 的安装与汉化指南