[Vue3核心语法] toRefs、toRef 一句话搞定

•         重要用途就是将对象解构出来照旧相应式数据
  
•         作用：将一个相应式对象中的每一个属性，转换为ref对象。
  
•         备注：toRefs与toRef功能同等，但toRefs可以批量转换。
  

示例：
 let person = reactive({name:'张三', age:18, gender:'男'})
person.name 是相应式

如果   let {name,age} = person
name、age 则不是相应式

通过toRefs、toRef将上述改成相应式
let {name,age} = toRefs(person)
let nl = toRef(person,'age')

2.   // 使用toRefs从person这个响应式对象中，解构出name、age，且name和age依然是响应式的
3.   // name和age的值是ref类型，其value值指向的是person.name和person.age
4.   let {name,age} = toRefs(person)  
5.   let nl = toRef(person,'age')
7. function changeName(){
8.     person.name += 'A'
9.     name.value += '~'
10.     console.log(name.value,person.name)
11.   }

复制代码

如果不加toRefs 则修改名字后 不再相应式增长~字符 

2. let {name,age} = person
3.   // 方法
4.   function changeName(){
5.     person.name += 'A'
6.     name += '~'
7.     console.log(name,person.name)
8.   }

复制代码