防抖函数需与去噪、竞态控制、状态管理协同优化搜索体验：必须监听input事件而非keyup，实时读取value，去噪逻辑置于防抖回调内，用abortcontroller处理竞态，并配合loading、缓存等状态管理。
防抖函数在搜索联想中不是“加了就完事”的开关，而是整套体验优化的起点。它真正起效，靠的是和去噪、竞态控制、状态管理协同配合。
防抖必须配 input 事件，不能用 keyup
input 事件能捕获所有输入行为：键盘敲击、粘贴、语音输入、IME 上屏（比如中文拼音选词后上屏）。keyup 只响应按键抬起，漏掉粘贴和上屏，用户一粘贴就触发不了联想，体验断层。
- 监听目标必须是 input 元素的 input 事件，或 Vue 中 v-model 绑定的 ref 值变化
- 确保每次防抖回调里重新读取当前 value，而不是闭包锁定初始值
- 避免在 Composition API 中把 searchKey 当参数传进 debounce，应让它在回调内部实时取值
去噪逻辑必须放在防抖回调里执行
防抖只管“等停手”，不管“值干不干净”。去噪是业务判断，得在防抖定时器真正触发后第一时间做。
- 先 trim() 清首尾空格，再判空或纯空白字符
- 长度小于 2 的词（如 “a”、“5”）直接跳过请求
- 过滤重复字符（如 “aaaa”、“????”），可用正则 /^(.)\1{3,}$/ 检测
- 屏蔽高频噪声词（如 “test”、“123”、“qwerty”），用 Set 或 Map 快速比对
- 非法符号（如 *、?、[）提前转义或剔除，避免后端报错
必须处理竞态，否则 UI 显示错乱
用户快速输入 “abc” → “ab” → “a”，防抖最终只发一次 “a”，但前两次 fetch 可能还在 pending，后到的响应会覆盖正确结果。
- 推荐用 AbortController：每次新请求前调用 controller.abort()
- fetch 时传入 { signal: controller.signal }，让旧请求自动中断
- Vue 3 中可在 onBeforeUnmount 里主动 abort，防止组件卸载后 still pending
- 不依赖 AbortController 时，也可用时间戳标记，只接受最新 timestamp 的响应
状态与缓存让体验更稳
loading、suggestions、空提示这些视觉反馈，全靠防抖触发后的逻辑链驱动，不是可有可无的装饰。
- 设 loading.value = true 开始请求，结束时设为 false，禁用输入期间可加 loading 遮罩
- 空结果时显示 “暂无建议”，别留白或闪一下消失
- 用 Map 缓存历史结果：cache.set(key, data)，命中直接赋值 suggestions，省请求
- 清空输入框时，同步重置 loading 和 suggestions，避免残留旧态
