「这是我参与2022首次更文挑战的第27天，活动详情查看：2022首次更文挑战」。
Reactivity介绍
我们可以打开官方文档直接查看，官方文档中其实是有清楚的响应式API的介绍的，如下图示：
响应式API包含：响应式基础API、Refs、Computed与watch、Effect作用域API
响应式基础API
响应式基础API包含
- reactive
- readonly
- isProxy
- isReactive
- isReadonly
- toRaw
- makeRaw
- shallowReactive
- shallowReadonly
reactive和后面的ref可以并为一组经常使用同种类型的API，reactive的特点就是，将数据转换为“深层”的对象响应式副本。(我们可以理解为对象的深层次监听)。
我们顺便讲一下refs，refs是vue3.0中被单独分体系分出去的一个API，它可以为我们的所有内部值返回一个响应式可变的ref对象，如果是对象类型，则内部会使用reactive来进行处理为深层响应式对象。
二者定义与使用如下：
const count = ref(1)
const obj = reactive({ count })
// 使用
console.log(count.value)
console.log(obj.value)
- readonly 将对象转为只读代理（深层次代理）
接下来就是三个is方法，这三个方法最好理解，可以用于判断是否为is后面的类型，比如：是否是代理、是否是只读、是否为响应式数据
- toRaw 将代理处理过的对象的原对象返回
... 后面的不常用，先列举出来，有兴趣的小伙伴可以去查看文档。
Refs
这组API包括ref、unref、toRef、toRefs、customref、shallowRef、triggerRef
最常用的是ref，其他可以去文档深入了解
Computed与watch
computed：计算属性，在composition API中，其接受一个getter函数，并且返回一个不可变的响应式ref对象，是2.0中的computed配置项在setup中的替代品。
watch部分经常用到的需要区分的就是watchEffect，watch和2.0中的watch的用法很相似,第一个参数是要监听的对象
watch(count, (count, preCount) => {})
watchEffect不太一样，它的含义是立即执行传入的一个函数，同时相应的追踪其依赖，并在其依赖变更的时候重新运行该函数。有点像2.0中的computed。它和watch之间最大的不同就是，watch是有目的的监听某一个或者某一些值。这个方法的作用是根据内部变量实时运行，wath是惰性的，对应变量变更才会运行方法。
Effect作用域API
Effect是一个高阶版本的功能，日常开发不太使用，但是很有趣
我们先看第一个
- effectScope
这个方法可以创建一个effect作用域对象，可以捕获其在内部创建响应式effect，使其可以一起被处理。
作者是这么理解的，这个方法为我们提供了分组处理的方案，可以批量管理&批量删除
const scope = effectScope()
scope.run(() => {
const doubled = computed(() => counter.value * 2)
watch(doubled, () => console.log(doubled.value))
watchEffect(() => console.log('Count: ', doubled.value))
})
// 处理该作用域内的所有 effect
scope.stop()
- getCurrentDispose
这个方法可以返回当前活跃的effect作用域
- onScopeDispose
为当前活跃的effect作用域注册一个处理毁掉，该毁掉在scope被销毁的时候调用。
