isRef
isRef(value)
- 作用：检查一个值是否为引用对象（ref对象）。
- 参数：
- value：要检查的值。
- 返回值：如果给定的值是引用对象，则返回true；否则返回false。
unRef
unRef(value)
- 作用：解引用（解包），是 val = isRef(val) ? val.value : val 的一个语法糖
- 参数：
- value：要解引用的值。
- 返回值：如果给定的值是引用对象，则返回引用对象的值；否则返回该值本身。
toRef
toRef(object, key)
个人理解：将某个对象的单个属性转为一个ref，也可以基于响应式对象（reactive）上的一个属性创建一个对应的 ref
- 作用：将一个响应式对象或普通对象的属性转换为一个单独的引用（ref）
- 参数：
- object：要操作的响应式对象。
- key：要转换为引用对象的属性键。
- 返回值：一个引用对象，其值与原始对象的属性值相同，并与原始对象的属性保持响应式关联。
- 适用场景
需要将某个 prop 传到一个外部函数中并保持响应性（isRef(props.xxx)==false），那么你可以使用 toRef() 这个工具函数
<script setup>
import { toRef } from 'vue'
const props = defineProps({
foo:{
type:"string",
default:""
}
})
// 将 `props.foo` 转换为 ref，然后传入
// 一个组合式函数
useSomeFeature(toRef(props, 'foo'))
</script>
toRefs
toRefs(object)
个人理解：将某个对象的属性全部转为ref并放在一个新对象中，新对象是普通对象，这个普通对象的每个属性都是指向源对象相应属性的 ref
- 作用：将一个响应式对象(reactive)转换为一个由所有属性转换为引用对象（ref对象）组成的新对象。
- 参数：
- object：要转换的响应式对象(reactive)。
- 返回值：一个新的对象，其属性与原始对象的属性相同，但每个属性都是引用对象。
- 适用场景
需要解构 props 对象并保持响应性，那么你可以使用 toRefs() 这个工具函数
import { toRefs, toRef } from 'vue'
export default {
setup(props) {
// 将 `props` 转为一个其中全是 ref 的对象，然后解构
const { title } = toRefs(props)
// `title` 是一个追踪着 `props.title` 的 ref
console.log(title.value)
}
}
