toRef可将reactive对象的属性转为双向响应式ref，支持对象属性、数组下标及默认值；仅适用于reactive对象，不适用于普通对象或ref本身。
直接用 toRef 把响应式对象的某个属性“拎出来”，变成一个带 .value 的 ref，同时它和原属性还是双向联动的——改它等于改原对象，改原对象也立刻反映到它身上。
基础用法：传入 reactive 对象 + 属性名
必须确保源对象是响应式的（比如用 reactive 创建的），然后指定要提取的属性名：
import { reactive, toRef } from 'vue'const state = reactive({ count: 0, name: 'Alice' })const countRef = toRef(state, 'count')- 之后可读写
countRef.value，页面中{{ countRef }}也能自动更新
支持数组下标，也能提取 reactive 数组元素
如果源对象是 reactive 包裹的数组，第二个参数可以传数字下标：
const list = reactive(['a', 'b', 'c'])-
const first = toRef(list, 0)→first.value就是'a' - 修改
first.value = 'x'，list[0]同步变为'x'
可选第三个参数：设置默认值（仅对 ref 生效）
当原对象该属性初始为 undefined 或尚未定义时，可提供默认值：
立即学习“前端免费学习笔记（深入）”；
const user = reactive({ id: 1 })const nickname = toRef(user, 'nickname', '游客')- 此时
nickname.value === '游客'，且后续若user.nickname = 'Tom'，nickname.value会自动更新为'Tom'
常见误区提醒
- 不能对普通对象（非 reactive）用
toRef—— 它不会变响应式，页面也不会更新 - 不要对
ref对象本身再套toRef，比如toRef(count, 'value')是错的；toRef只用于reactive或shallowReactive的属性 - 解构后丢失响应式？
toRef正是为解决这个问题而生：它让单个属性也能保持响应式连接，适合传给子组件或组合式函数
