vue3知识点：reactive对比ref

合集 - Vue3(7)

1.vue3知识点：Teleport组件2024-10-302.《vue3第六章》其他，包含：全局API的转移、其他改变2024-10-303.《vue3第四章》Composition API 的优势，包含Options API 存在的问题、Composition API 的优势2024-10-304.《vue3第五章》新的组件，包含：Fragment、Teleport、Suspense2024-10-305.vue3知识点：响应式数据的判断2024-10-316.vue3第一章基础：创建Vue3.0工程，包括使用vue-cli 创建、使用 vite 创建2024-10-31

7.vue3知识点：reactive对比ref2024-10-31

收起

@

目录

• 二、常用 Composition API
  • 5.reactive对比ref
• 本人其他相关文章链接

二、常用 Composition API

问题：啥叫“组合式API”？

答案：请看官方文档: https://v3.cn.vuejs.org/guide/composition-api-introduction.html

5.reactive对比ref

• 从定义数据角度对比：
  • ref用来定义：基本类型数据。
  • reactive用来定义：对象（或数组）类型数据。
  • 备注：ref也可以用来定义对象（或数组）类型数据, 它内部会自动通过reactive转为代理对象。
• 从原理角度对比：
  • ref通过Object.defineProperty()的get与set来实现响应式（数据劫持）。
  • reactive通过使用Proxy来实现响应式（数据劫持）, 并通过Reflect操作源对象内部的数据。
• 从使用角度对比：
  • ref定义的数据：操作数据需要.value，读取数据时模板中直接读取不需要.value。
  • reactive定义的数据：操作数据与读取数据：均不需要.value。

本人其他相关文章链接

1.《vue3第二章》常用组合式 Composition API，包括setup、ref函数、reactive函数、vue3.0中的响应式原理、计算属性与监听属性
2.vue3知识点：setup
3.vue3知识点：ref函数
4.vue3知识点：reactive函数
5.vue3知识点：Vue3.0中的响应式原理和 vue2.x的响应式
6.vue3知识点：reactive对比ref
7.vue3知识点：计算属性与监视属性
8.vue3知识点：生命周期
9.vue3知识点：自定义hook函数
10.vue3知识点：toRef函数和toRefs函数