Vue3-ref函数和reactive函数

ref函数

1. 作用：定义一个响应式的数据，或者说是生成一个引用实现对象
2. 语法：const xxx = ref(initValue)
   • 创建一个包含响应式数据的引用对象（reference对象）
   • JS中操作数据需要：xxx.value
   • 模板中读取数据：直接使用即可

PS：

1. ref接收的数据可以是基本类型数据，也可以是对象类型
2. 基本类型的数据：响应式是靠Object。defineProperty()的get和set完成的
3. 对象类型的数据：内部使用了reactive函数

reactive函数

1. 作用：定义一个对象类型的响应式数据
2. 语法：const 代理对象 = reactive(源对象) 参数是一个对象或者数组，返回一个代理对象（Proxy的实例对象，简称proxy对象）
3. reactive定义的响应式数据是深层次的
4. 内部基于ES6的Proxy实现，通过代理对象操作源对象内部数据