toRef<T>(value: T): T extends (() => infer R) ? Readonly<Ref<R>> : T extends Ref ? T : Ref<UnwrapRef<T>>
Used to normalize values / refs / getters into refs.
Example
// returns existing refs as-is toRef(existingRef)
// creates a ref that calls the getter on .value access toRef(() =>props.foo)
// creates normal refs from non-function values // equivalent to ref(1) toRef(1)
Can also be used to create a ref for a property on a source reactive object.
The created ref is synced with its source property: mutating the source
property will update the ref, and vice-versa.
Example
conststate = reactive({ foo:1, bar:2 })
constfooRef = toRef(state, 'foo')
// mutating the ref updates the original fooRef.value++ console.log(state.foo) // 2
// mutating the original also updates the ref state.foo++ console.log(fooRef.value) // 3
Used to normalize values / refs / getters into refs.
Example
Can also be used to create a ref for a property on a source reactive object. The created ref is synced with its source property: mutating the source property will update the ref, and vice-versa.
Example
See
https://vuejs.org/api/reactivity-utilities.html#toref