简述ref与reactive区别

ref和reactive都是Vue 3中的响应式API。它们的主要区别在于ref只能用于创建单个响应式数据，而reactive可以用于创建包含多个响应式数据的对象。

ref创建的是一个包装器对象，它将基本类型的数据转换为响应式数据。例如，使用ref创建一个数字类型的响应式数据可以这样写：

import { ref } from 'vue'

const count = ref(0)

而reactive创建的是一个响应式对象，它可以包含多个属性。例如，使用reactive创建一个包含多个属性的响应式对象可以这样写：

import { reactive } from 'vue'

const state = reactive({
  count: 0,
  message: 'Hello World'
})

需要注意的是，当我们使用reactive创建响应式对象时，我们可以直接修改对象中的属性，而不需要使用.value。例如，我们可以这样修改上面的state对象：

state.count++
state.message = 'Hello Vue 3'

而对于ref创建的响应式数据，我们需要使用.value来获取或修改其值。例如，我们可以这样修改上面的count变量：

count.value++