ref

# ref

# 总结

  1. ref 是一个对象(不丢失响应式),value 存储值;

  2. 通过.value 属性的 get 和 set 实现响应式;

  3. 用于模板,reactive 时,不需要.value,其他情况都需要;

# 为什么要用.value

值类型进行值复制,对象传递引用指针,看个栗子

function computed(getter) {
  let value = 0;
  setTimeout(() => {
    value = getter();
  }, 1500);
  return value;
}

let a = 0;
a = computed(() => 100);

// 过了1.5s,a还是0,但这个零是value给的

使用对象的形式即可实现

function computed(getter) {
  const ref = {
    value: null,
  };
  setTimeout(() => {
    ref.value = getter();
  }, 1500);
  return ref;
}

let a = {};
a = computed(() => 100);

# toRef & toRefs

  • 初衷:不丢失响应式的情况下,把对象数据分解/扩散;

  • 前提:针对的是响应式对象(reactive 封装的)非普通对象;

  • 注意:不创造响应式,而是延续响应式;