ref相关的函数
ref 是 vue 为了实现简单类型的响应性，而设计的一个函数，同时也支持对象类型（会把对象变成reactive的形式）。所以使用范围非常广泛。
unref
如果参数为 ref，则返回内部值，否则返回参数本身。
// 简单类型
const string = Vue.ref('jyk')
// 对象
const person = Vue.ref({
name: 'jyk',
age: 100
})
// unref
console.log('person:',unref(person))
console.log('personToRaw:',toRaw(person))
console.log('personUnrefToRaw:',toRaw(Vue.unref(person)))
console.log('string:',unref(string))
console.log('stringUnrefToRaw:',toRaw(Vue.unref(string)))
console.log('unref:',unref({name:'unref'}))
打印看效果
020ref-unref.png
不知道为啥要设计这样的函数，感觉好鸡肋呀。反复测试了一下，大概是这个意思。
我想得到数据原型，但是又不知道传递过来的是个js类型，还是ref的形式。
那么你就可以用unref来取原值。
但是这个只限于简单类型，比如number、string。但是如果原型是js对象的话，取出来的就是reactive的形式，并不是js对象。
如果想实现，不管是简单类型，还是对象类型，我都要原型的话，还得这样写。
toRaw(unref(person))
就是先用unref取（ref的）原型，然后再用toRaw取（reactive的）原型。
这种方式适合简单类型和对象类型。
toRef
简单的说，从一个reactive形式的对象里面，提取出来一个指定的属性，然后变成ref形式的对象，以便于保持属性的响应性。
// toRef
const person2 = Vue.reactive({
name: 'jyk',
age: 100
})
const personNameToRef = toRef(person2, 'name')
console.log('toRef', personNameToRef)
console.log('toRefValue', personNameToRef.value)
打印看效果
021ref-toRef.png
其实这个不是和
ref(person2.name)
一个意思吗？
toRefs
简单的说，就是批量的toRef。
toRef一次只能变一个属性，toRefs一次能把所有属性都变了。
// toRef
const person2 = Vue.reactive({
name: 'jyk',
age: 100
})
const personToRefs = Vue.toRefs(person2)
console.log('toRefs', personToRefs)
console.log('toRefs2', personToRefs.name)
打印看效果
022ref-toRefs.png
- 应用场景（也许是个漏洞）
在setup里面，操作props属性。
因为在setup里面，props是不能直接使用的，
const foo = props
这样会报错。
那么可以这么写：
const foo = toRefs(props)
注意，如果属性都是简单类型的话，修改foo，不会改变父组件里面的变量。
但是，如果属性是对象的话，修改foo就会改变父组件里面的对象。
所以使用的时候一定要慎重！
- 应用场景，setup里的return
如果定义了一个深层次对象，如果直接return的话，那么在模板里面就要使用{{person.name}}的形式来使用。
如果想简化一下直接{{name}}的方式使用的话，就可以在return里面使用 ...toRefs的形式。
比如这样：
return {
person,
...personToRefs
}
这样模板里面可以直接使用{{name}}了。
注意，这里的“...”不是省略号的意思，而是ES6提供的一种“展开属性”的方式。
isRef
判断是不是ref形式的对象。
这个就比较简单了，不过我们还是跑一下代码。
// isRef。对象定义在上面。
console.log('reactive', Vue.isRef(person2))
console.log('ref', Vue.isRef(person))
console.log('object', Vue.isRef({name:'isRef'}))
console.log('number', Vue.isRef(123))
打印看效果
023ref-isRef.png
