ref、reactive、toRef、toRefs使用与区别

• arg为普通对象

• arg为任意类型，推荐基本类型使用

针对reactive中$1的问题，创建了toRef

传参：toRef(arg1, arg2)

• 参数1：arg1 - reactive响应式对象
• 参数2：arg2 - 该响应对象中的某个属性。

可以针对reactive创建的响应式对象中的某个属性创建一个ref，且两个之间保持引用关系。

也就是说用一个对象的某个属性，可以通过两个方式来改变，结果是一致的，都反应到了该响应式对象上来。

例：

// 响应式对象
const state = reactive({
    name: 'cc',
    age: 18
})

// 通过toRef创建一个Ref响应式
const nameRef = toRef(state, 'name')

// 此时有两种方式来改变state中的name属性，且都具有响应式

// 方式一
state.name = 20 // state = {name: 'cc', name: 20}

// 方式二
nameRef.value = 30 // state = {name: 'cc', name: 30}

• toRef是将reactive中的某个属性转为ref
• toRefs是一次性将reactive中的所有属性都转为ref

• 只接受一个参数，为reactive响应式对象