在Vue 3中，`toRef`和`toRefs`是两个常用的函数，它们都是Composition API的一部分。这两个函数主要用于将响应式对象的属性转换为单独的响应式引用，使得我们可以在组件中更方便地访问和管理这些属性。

我们来看一下`toRef`函数。`toRef`函数接受两个参数：一个是要转换的对象，另一个是该对象上的属性名。`toRef`会返回一个新的响应式引用，这个引用会响应原对象上对应属性的变化。

例如，假设我们有一个响应式对象`state`，它有一个属性`count`，我们可以使用`toRef`创建一个对`count`的引用`refCount`：

```javascript

import { ref, toRef } from 'vue'

const state = ref({ count: 0 })

const refCount = toRef(state, 'count')

```

在这个例子中，`refCount.value`会等于`state.value.count`，并且当`state.value.count`变化时，`refCount.value`也会相应地变化。

然后，我们来看一下`toRefs`函数。`toRefs`函数接受两个参数：一个是要转换的对象，另一个是一个包含属性名字符串的数组。`toRefs`会返回一个新的响应式引用对象，这个对象的每个属性都是对原对象上对应属性的引用。

例如，假设我们有一个响应式对象`state`，它有两个属性`count`和`name`，我们可以使用`toRefs`创建一个新的响应式引用对象`refs`：

```javascript

import { reactive, toRefs } from 'vue'

const state = reactive({ count: 0, name: 'Vue3' })

const refs = toRefs(state)

```

在这个例子中，`refs.count.value`会等于`state.count`，`refs.name.value`会等于`state.name`，当`state.count`或`state.name`变化时，`refs.count.value`或`refs.name.value`也会相应地变化。

`toRef`和`toRefs`函数为我们提供了一种方便的方式来管理和访问响应式对象的属性，这使得我们在编写Vue 3代码时更加灵活和高效。