搞不懂vue3.0 ref和reactive类型定义有什么区别吗

了解ref和reactive的区别
其他文章
首先我们都知道ref函数和reactive函数都是用来定义响应式数据；

但是reactive更适合定义复杂的数据类型（json/arr）、ref适合定义基本数据类型（可接收基本数据类型和对象）

reactive:
(1)它的响应式是更加‘深层次’的，底层本质是将传入的数据包装成一个Proxy。

(2)参数必须是对象或者数组，如果要让对象的某个元素实现响应式时比较麻烦。需要使用toRefs

ref:
(1)函数参数可以是基本数据类型，也可以接受对象类型

(2)如果参数是对象类型时，其实底层的本质还是reactive,系统会自动根据我们给ref传入的值转换成：

ref(1)->reactive({value:1})
ref函数只能操作浅层次的数据，把基本数据类型当作自己的属性值；深层次依赖于reactive

(3)在template中访问，系统会自动添加.value;在js中需要手动.value

(4)ref响应式原理是依赖于Object.defineProperty()的get()和set()的。

ref、toRef、toRefs的区别
ref:复制，修改响应式数据不影响以前的数据；数据改变，界面自动更新

toRef:引用，修改响应式数据会影响以前的数据；数据改变，界面不自动更新

toRefs：

(1)接收一个对象作为参数，它会遍历对象身上所有属性，然后调用单个toRef

(2)将对象的多个属性变成响应式数据，并且要求响应式数据和原始数据关联，且更新响应式数据的时候不会更新界面，用于批量设置多个数据为响应式