1. reactive api
为什么要使用reactive api，因为想要复刻options api的做法，在setup函数中是行不通的，data函数中定义的变量之所以是响应式的，是因为经过了reactive函数的处理。
可以看到这样的写法变量counter不是响应式的。
使用reactive api修改之后：将counter放在对象中，由reactive函数处理，使用处理过的返回值中的couter
可以看到，此时state对象中的counter已经是响应式的了。
reactive api传入类型必须是对象或者数组，这样在使用时，需要用state.counter的形式来取用counter，感觉有点麻烦，这时Vue3提供了另一个api：ref api。
2.ref api
使用ref api需要注意的地方：
1.ref传入类型：所有类型，比reactive api不受限制；
2.ref返回一个响应式的对象，value属性维护其值；
3.模板(template)中会自动解包，不需要以.value的形式获取值，但setup函数中不会自动解包。
如果我将counter放在一个对象中，再使用ref，那么模板是否会自动解包：不会
4. 原因：ref的解包是一个浅层的解包
此时需要.value来获取这个ref对象的值
但是reactive api 包裹的对象，可以深层解包
3.reactive判断的api
1. isProxy: 检查对象是否由reactive或readonly创建的proxy；
2. isReactive: 检查对象是否是由 reactive创建的响应式代理，但是如果该代理是 readonly 建的，但包裹了由 reactive 创建的另一个代理，它也会返回 true；
3. isReadonly: 检查对象是否是由 readonly 创建的只读代理；
4. toRaw: 返回 reactive 或 readonly 代理的原始对象(不建议保留对原始对象的持久引用)
5. shallowReactive: 创建一个响应式代理，它跟踪其自身 property 的响应性，但不执行嵌套对象的深层响应式转换(深层还是原生对象)；
6. shallowReadonly: 创建一个 proxy，使其自身的 property 为只读，但不执行套对象的深度只读转换(深层还是可读、可写的)；
4.Ref api 的补充
假如想对响应式对象解构赋值，尽管是reactive处理过的对象，解构出来的值不会是响应式的
想让其成为响应式的，可以使用toRefs api
1.toRefs api: 将reoctive对象中的所有属性都转成ref，建立连接
而且，toRefs api相当于在info中的每一个属性的value与解构之后的值做了连接，一个更改之后另一个也会随之更改
如果只想对其中一个属性转换为ref，那么可以使用toRef api
2.toRef: 对其中一个属性进行转换ref，建立连接
格式：toRef(object,key）
