持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第30天，点击查看活动详情juejin.cn/post/714765…
- 今天学习了Vue3组合式API中的有关响应式工具，涉及到的也都是一些方法。
- 总结了以下这些方法。只要是带由is的，就是用来做判断，带有to都是把某一种类型转换为另一种类型。
- 下面给每个方法都写一个简单的小例子，小伙伴们可以看一看。
isRef()
检查某个值是否为 ref。
const foo=ref('tom')
const bar={age:ref(10)}
console.log(isRef(foo),isRef(bar.age));//true
unref（）
把ref转换为普通类型 val = isRef(val) ? val.value : val 计算的一个语法糖。
const foo=ref('tom')
console.log(unref(foo),unref('你好'));//tom,你好
toRef（）
是把响应式对象的某一个属性，转换为了值是由ref（）创建的。该方法会更改源数据，源数据里的也成为了响应式。所以说该方法与源数据是双向的绑定，转换后的值变，源数据的值也会变，反之亦然。
const person=reactive({
name:'lily',
class:5
})
let c=toRef(person,'class');
console.log(++c.value，person.class);//6 ，6 相当于把person的name转换为了person={class:Ref(5)}
toRefs（）
把一个响应式对象转为普通对象，但是把它的每个属性值都转为了由ref（）创建的值，虽然下main的test转为了普通对象，但是它的值依然是响应式。改变前与改变后的数据双向绑定，其中一个变，另一个也变。
使用toRefs（）方法，相当于进行了如下转换：
const test = reactive({
name:'tom',
age:20
})
toRefs(test)
const test={
name:ref('tom'),
age:ref(20)
}
所以，通过上面这样转化的话，对test进行解构，不会失去响应式。如果直接对由reactive创建出来的响应式对象进行本地解构，是会失去响应式的。
isProxy()
- 检查一个对象是否是由
reactive()、readonly()、shallowReactive()或shallowReadonly()创建的代理。 - 返回值是布尔值
const person=reactive({
name:'lily',
class:5
})
console.log( isProxy(person) );//true
isReactive（）
检查一个对象是否是由 reactive() 或 shallowReactive() 创建的代理。
const person=shallowReactive({
name:'lily',
class:5
})
console.log(isReactive(person))；//true
isReadonly()
检查一个对象是否是由 readonly()或 shallowReadonly() 创建的代理。
const foo=ref('tom')
console.log(isReadonly(foo))；//false
