应禁用按钮并用锁变量防抖：点击后立即禁用按钮，submit回调中检查锁变量，请求完成后延时释放锁；table.reload需包裹防抖函数，销毁前清除定时器。
search 表单提交时怎么加防抖
直接给 form.on('submit(filter)') 里套 setTimeout 没用——因为表单默认会立即提交并刷新，防抖逻辑根本来不及生效。真正要防的是「用户连点搜索按钮」或「输完立刻狂按回车」导致的重复请求。
正确做法是：禁用按钮 + 防抖重置状态，而不是拦 submit 事件本身。
- 给搜索按钮加
id="searchBtn"，初始不设disabled，但点击后立刻btn.disabled = true - 在
form.on('submit(filter)')回调开头加防抖控制变量，比如let searchLock = false；若为true直接return false - 发起 AJAX 前设
searchLock = true，请求完成（无论 success/fail）后用setTimeout(() => searchLock = false, 500)解锁 - 别忘了在
success或complete里恢复按钮状态：document.getElementById('searchBtn').disabled = false
layui.table.reload 搜索时如何避免重复触发
表格搜索常配合 table.reload() 实现，但用户快速点两次「搜索」，就会发两个 reload 请求，DOM 可能错乱、loading 状态打架、甚至后端收到两份 where 参数。
关键不是压住 reload，而是压住「触发 reload 的动作」。
- 不要把
table.reload()写在按钮click里裸调，必须包一层防抖函数 - 推荐用闭包变量 + 时间戳判断：
if (Date.now() - lastSearchTime - 如果用了
form.on('submit')，同样适用上述searchLock方式，且需在table.reload()的done回调里解锁，否则翻页/排序可能被误锁 - 注意：
table.reload()本身不阻塞，所以防抖必须落在它之前，不能靠它的回调去节流
带 lay-search 的 select 如何防止输入过程疯狂过滤
原生 lay-search 下拉框在大数据量下，每次 input 都执行全文匹配，用户还没松手，CPU 就开始飙高。这不是功能问题，是默认行为太激进。
防抖目标不是“不让搜”，而是“等他打完再搜”。
- 移除
lay-search属性，改用自定义<input>+ 手动监听，这是唯一可控路径 - 对 input 的
input事件加setTimeout，延迟设为300ms，并在每次新输入时clearTimeout原定时器 - 只在输入长度 ≥ 2 时才发起过滤或远程请求，空字符串或单字符直接
return - 特别注意
compositionstart/compositionend事件，中文输入法下必须拦截中间态，否则防抖失效（比如“你好”还没上屏就触发了两次搜索）
为什么 debounce 函数不能全局复用一个 timer 变量
多个搜索入口（比如用户名搜索、部门搜索、日期范围搜索）共用同一个 timer 或 lock 变量，会导致互相干扰：A 搜索还没结束，B 搜索就被拦住，体验断层。
真实场景中，每个搜索操作应有独立生命周期。
- 用 DOM 元素的
dataset存状态，例如input.dataset.searchLocked = 'true'，不同 input 互不污染 - 或者把防抖逻辑封装成函数工厂：
const createDebouncedSearch = (inputEl) => { let timer; return (fn) => { clearTimeout(timer); timer = setTimeout(fn, 300); } } - 避免闭包变量跨作用域泄漏，尤其在 table 工具栏、弹窗内嵌搜索等动态 DOM 场景下，timer 容易变成悬空引用
- 组件销毁前记得
clearTimeout，否则可能触发已卸载组件的回调，报Cannot read property 'xxx' of null
防抖本身很简单，难的是它嵌在哪一层、状态挂在哪、什么时候清——漏掉任意一环，都可能让“防抖”变成“偶尔失灵”。
