From 52913a835f5f531ac4e38f5aca9527007d8f19e7 Mon Sep 17 00:00:00 2001 From: skirtle <65301168+skirtles-code@users.noreply.github.com> Date: Thu, 17 Mar 2022 18:35:16 +0000 Subject: [PATCH] Update API entry for toRef to mention mutating props --- src/api/reactivity-utilities.md | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/api/reactivity-utilities.md b/src/api/reactivity-utilities.md index 4afc095241..c38c53d838 100644 --- a/src/api/reactivity-utilities.md +++ b/src/api/reactivity-utilities.md @@ -80,12 +80,14 @@ Can be used to create a ref for a property on a source reactive object. The crea const fooRef = ref(state.foo) ``` - The above ref is **not** synced with `state.foo`, because the `ref()` receives a plain string value. + The above ref is **not** synced with `state.foo`, because the `ref()` receives a plain number value. `toRef()` is useful when you want to pass the ref of a prop to a composable function: ```vue ``` - `toRef()` will return a usable ref even if the source property doesn't currently exist. This makes it especially useful when working with optional props, which wouldn't be picked up by [`toRefs`](#torefs). + When `toRef` is used with component props, the usual restrictions around mutating the props still apply. Attempting to assign a new value to the ref is equivalent to trying to modify the prop directly and is not allowed. In that scenario you may want to consider using [`computed`](./reactivity-core.html#computed) with `get` and `set` instead. See the guide to [using `v-model` with components](/guide/components/events.html#usage-with-v-model) for more information. + + `toRef()` will return a usable ref even if the source property doesn't currently exist. This makes it possible to work with optional properties, which wouldn't be picked up by [`toRefs`](#torefs). ## toRefs()