watcheffect 实现搜索自动检索，自动追踪 keyword 等响应式依赖，挂载即执行、变化即响应；内置 settimeout + oninvalidate 防抖、abortcontroller 防竞态，多条件联动无需显式列依赖。
用 watchEffect 实现搜索关键词自动触发检索，核心是“自动追踪 + 立即响应 + 可控清理”，不需要手动列依赖、也不用配 immediate: true，写起来简洁，跑起来可靠。
基础写法：监听关键词并发起请求
只要在回调里读取 keyword.value，watchEffect 就会自动盯住它：
- 组件挂载时立刻执行一次（比如初始化加载空列表或默认关键词）
- 用户输入导致
keyword变化时，自动重新执行 - 无需
watch([keyword], ...)或watch(keyword, ...)那种显式声明
加防抖：避免频繁请求
直接在 watchEffect 回调里用 setTimeout，再配合 onInvalidate 清除上一个定时器：
vue-composition-api-best-practices
Vue 3 组合式 API 与
热门下载
相关下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章