vue3 当中 ref 与 reactive 的区别

3. vue3 当中 ref 与 reactive 的区别
   ref 和 reactive 都是 Vue3 中的响应式数据的实现方式。
   ref 主要用于将普通的数据类型包装成响应式对象，通过 .value 属性来访问该值，当值被修改时会触发视图的更新。例如：
   import { ref } from 'vue'

const count = ref(0)

console.log(count.value) // 0

count.value++ // 视图会自动更新

reactive 则是将一个对象转换成响应式对象，当对象的属性被修改时会触发视图的更新。例如：
javascriptCopy code
import { reactive } from 'vue'

const state = reactive({
count: 0
})

console.log(state.count) // 0

state.count++ // 视图会自动更新

总的来说，ref 适用于简单数据类型的响应式处理，而 reactive 则适用于复杂数据类型的响应式处理。此外，ref 可以通过 .value 访问值，而 reactive 则可以直接访问对象的属性。