uni-app搜索框自动补全需后端支持，前端用@input+防抖（300ms）、输入长度
uni-app 里做搜索框自动补全（关键词联想），核心不是靠前端“猜”，而是靠后端返回匹配词 + 前端控制触发时机和展示逻辑。直接用本地数组 filter 模拟，上线后基本不可用。
uni-app 中 input 事件触发联想太频繁，怎么压住？
用户每敲一个字就发请求，不仅浪费带宽，还容易被后端限流或返回乱序结果。必须加防抖。
- 别用
@keyup或@blur，统一用@input - 在
methods里手写防抖函数，或直接用lodash.debounce（需 npm 安装并引入） - 推荐延迟值设为
300，太短没意义，太长（如 800ms）用户会觉得卡顿 - 输入长度
时直接清空联想列表，不发起请求 —— 避免搜“a”“的”这类无意义词
怎么调用后端接口获取联想词？用 uni.request 还是 uniCloud.callFunction？
取决于你的后端部署方式。如果已用 uniCloud，优先走 uniCloud.callFunction，省去跨域和 token 管理；否则必须用 uni.request，且注意配置 header 和超时时间。
-
uni.request要显式加header: { 'Content-Type': 'application/json' }，否则部分后端收不到 body - 接口路径建议带版本号，比如
/api/v1/suggest?keyword=xxx，方便后续灰度 - 务必处理
fail回调：网络失败、404、500 都要清空联想列表，避免残留旧数据 - 后端返回字段名尽量固定，例如统一用
data.suggestions数组，前端不用反复判断
联想词列表怎么渲染才不闪、不跳、不遮挡？
常见问题是：列表突然出现/消失导致页面重排；点击联想词后输入框失去焦点；iOS 上弹出键盘把列表顶跑。
- 用
v-show控制显示隐藏，别用v-if—— 避免反复销毁重建 DOM - 列表容器加
position: absolute+top: 100%，锚定在 input 下方，不占文档流 - 给列表加
z-index: 999，但别盲目设太高（如 9999），防止盖住原生组件（如地图、视频） - 点击联想词后，手动调用
this.$nextTick(() => this.$refs.inputRef.focus())保持焦点，避免 iOS 键盘收起 - 在
onReachBottom或滚动事件里主动隐藏列表，防止它悬在半空
为什么联想词点了没反应，或者点完 keyword 没更新？
多数是事件绑定或响应式失效。uni-app 的 v-model 在某些场景下不会自动同步原始 input 的 value，尤其用了自定义组件封装时。
- 不要只依赖
v-model="keyword"，在点击联想项时，显式赋值this.keyword = item并调用搜索方法 - 如果用了
uni-search-bar，它内部没有暴露value的双向绑定，得用@confirm+@focus组合监听 - 检查 data 里
keyword是否声明为字符串初始值（''），而非undefined，否则 Vue 无法劫持响应式 - 真机调试时，微信小程序里
input的confirm-type设为search，能唤起键盘搜索按钮，提升体验
真正难的不是渲染列表，而是让联想词既快又准——这取决于后端分词策略、缓存命中率和接口 P95 延迟。前端能做的，就是别让它更慢、更错、更糊。
