lodash库提供的debounce函数用于限制传入函数的调用频率,确保函数在指定的时间间隔内最多只执行一次。debounce返回的函数本身并不是异步的,它只是限制了调用频率,但并不改变传入函数的同步或异步特性
下面案例包含了输入框防抖和按钮防抖
<template>
<el-button type="success" @click="buttonDebounce">防抖按钮测试</el-button>
<el-form :model="textForm">
<el-form-item label="防抖测试输入框:" prop="text" :rules="rules">
<el-input v-model="textForm.text" style="width: 120px;"></el-input>
</el-form-item>
</el-form>
</template>
<script>
import { debounce } from 'lodash';
const buttonDebounce = debounce(() => {
console.log("防抖测试");
}, 900);
const validateText = debounce((rule: any, value: any, callback: any) => {
if(value.length < 4) callback(new Error("长度至少为4"))
else callback()
}, 900)
const rules = [
{ required: true, trigger: 'change', validator: validateText }
]
</script>
标签:防抖,const,函数,debounce,callback,any
From: https://www.cnblogs.com/twinkler/p/18147757