customRef 是 Vue.js 精确控制响应式读写、插入副作用或对接外部状态的底层 API：需手动在 get 中调用 track()、set 中调用 trigger()，典型应用包括防抖输入、localStorage 双向同步和异步数据封装。
Vue.js 自定义响应式 API 的核心是 customRef，它不是用来替代 ref 或 reactive 的常规工具，而是当你需要**精确控制读写时机、插入副作用或对接外部状态**时的底层解决方案。
customRef 的本质：手动管理依赖追踪
普通 ref 由 Vue 自动处理依赖收集与更新通知；而 customRef 把这两件事交给你决定：
- get() 中必须调用 track() —— 告诉 Vue：“当前这个副作用正在读这个值，后续变化要通知它”
- set() 中必须调用 trigger() —— 告诉 Vue：“值已更新，请刷新所有依赖它的地方”
- 漏掉 track，读取不会被监听；漏掉 trigger，视图不会更新
防抖输入：最典型的 customRef 应用
适用于搜索框、表单实时校验等场景，避免高频 setter 触发多余计算或请求：
- 在 set 里清除上一次定时器，新建延迟赋值
- 只在延迟结束后才真正更新内部 value 并 trigger
- get 仍立即返回当前缓存值，保证读取一致性
localStorage 双向同步：跨标签页响应
让 ref 值自动持久化，并响应其他浏览器标签页的变更：
立即学习“前端免费学习笔记（深入）”；
- get 从 localStorage 读取，同时 track 以建立响应关联
- set 写入 localStorage，并 trigger 更新本地依赖
- 额外监听 window.storage 事件，在其他标签页修改时主动 trigger
异步数据封装：带 loading 和 cancel 的 ref
把 Promise 转成可响应式读取的状态容器：
- get 返回 { data, loading, error } 结构，首次访问触发 fetch
- set 接收新 Promise，自动取消前序请求、重置状态、触发更新
- 内部用 AbortController 实现 cancel，避免过期回调污染 state
