toRefs和toRef的基本使用

toRefs和toRef

toRefs

• 如果我们使用ES6的解构语法，对reactive返回的对象进行解构获取值，那么之后无论是修改结构后的变量，还是修改reactive
  返回的state对象，数据都不再是响应式的

  const info = reactive({
    name: "beichen",
    age: 22
  });
  
  const { name, age } = info;

  在这里return返回的name和age我们在使用的时候就不再是响应式的了

当我们使用toRefs时来解构时，return返回的数据就是响应式的

const info = reactive({
  name: "beichen",
  age: 22
});

const { name, age } = toRefs(info);

这种做法相当于在info.name和info.age与ref.value之间建立的链接，修改其中任何一个的值，另外一个都会随之改变

toRef

• toRef: 对其中一个属性进行转换ref，建立链接

  const info = reactive({
    name: "beichen",
    age: 22
  });
  // toRef中有两个参数第一个是object，第二个是key值
  const age = toRef(info, "age");