你知道vue3的customRef吗？你知道它和ref的区别吗？你知道它的应用场景吗？

customRef

customRef() 是 Vue 3 中新增的 API，用于创建自定义 ref，并对其依赖项跟踪和更新触发进行显式控制。

用途

• 实现防抖/节流：通过控制依赖项收集和更新触发时机，可以实现防抖/节流功能。
• 自定义计算属性：可以根据特定逻辑计算值，并控制何时更新视图。
• 优化性能：可以避免不必要的更新，提升性能。

工作原理

customRef() 接收一个工厂函数作为参数，该函数接收 track 和 trigger 两个函数作为参数，并返回一个带有 get 和 set 方法的对象。

• track：用于收集依赖项。在 get 方法中调用，收集该 ref 所依赖的响应式数据。
• trigger：用于触发更新。在 set 方法中调用，通知依赖项更新视图。

示例：

const count = customRef((track, trigger) => {
   
  let num = 0;

  return {
   
    get: () => num,
    set: (val) => {
   
      num = val;
      trigger();
    },
  };
});

const update &