\r\n \u003Cinput v-model=\"fields.address1\" />\r\n \u003Cinput type=\"checkbox\" v-model=\"fields.copyAddress1ToAddress2\" />\r\n \u003Cinput v-model=\"fields.address2\" :disabled=\"fields.copyAddress1ToAddress2\"/>\r\n \u003C/form>\r\n\u003C/template>\r\n```\r\n\r\n### Suggested solution\r\n\r\nThe implementation is very simple, currently I am copy/pasting it between projects:\r\n\r\n```ts\r\nimport type { UnwrapRef, WatchSource } from \"vue\"\r\n\r\n/** @returns ref which resets when the source changes */\r\nexport function computedRef\u003CT>(source: WatchSource\u003CT>) {\r\n const value = ref(toValue(source))\r\n watch(source, (source) => {\r\n value.value = source as UnwrapRef\u003CT>\r\n })\r\n return value\r\n}\r\n```\r\n\r\n### Alternative\r\n\r\nVueUse already has `reactiveComputed`, but it's not directly suitable, as it must always return an object. Therefore:\r\n\r\n1. It can't be used when the source data could be is unavailable (`reactiveComputed` can't return `undefined`).\r\n\r\n2. It can't be used when the ref is a non-object. For instance, consider a case when a list can be expanded and collapsed, which is a boolean ref. The default state (collapsed or expanded) could be dependent on the list length, such as it's expanded by default when it's 10 or less items, and collapsed if there's more. Then, when a list is updated, it must recalculate its expanded status based on the new length.\r\n\r\nOf course, we could always work around and return an object shaped as `{ value: \u003Cactual value, possibly undefined> }`, but why not have a function that uses a native Vue `Ref` for that case? It will also unwrap naturally in templates.\r\n\r\n### Additional context\r\n\r\nNaming is subject for discussion. For consistency with `reactiveComputed`, it could be `refComputed`. (To be honest, I would rather reverse both, `computedReactive` and `computedRef` read better in my thinking.)\r\n\r\n### Validations\r\n\r\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://vueuse.org/guide).\r\n- [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.",[2965,2966],{"name":2922,"color":2923},{"name":2967,"color":2968},"new function","9C3E49",3485,"closed","computedRef (same as reactiveComputed but returns a ref)","2025-03-16T06:35:25Z","https://github.com/vueuse/vueuse/issues/3485",0.7382234,{"description":2976,"labels":2977,"number":2978,"owner":2925,"repository":2925,"state":2970,"title":2979,"updated_at":2980,"url":2981,"score":2982},"### Describe the bug\r\n\r\n`debTest` gets updated immediately instead of after a 1000ms delay.\r\n```typescript\r\nconst test = ref({ value: 'TEST' });\r\nconst debTest = refDebounced(test, 1000, { maxWait: 2000 });\r\n```\r\n\r\nDoing this works but is quite wordy with bigger objects.\r\n```typesript\r\nconst test = ref({ value: 'TEST' });\r\nconst debTest = refDebounced(\r\n\tcomputed(() => ({ value: test.value.value })),\r\n\t1000,\r\n\t{ maxWait: 2000 }\r\n);\r\n```\r\n\r\n### Reproduction\r\n\r\nexamples provided above\r\n\r\n### System Info\r\n\r\n```Shell\r\nSystem:\r\n OS: Windows 10 10.0.22621\r\n CPU: (16) x64 AMD Ryzen 7 5700U with Radeon Graphics\r\n Memory: 2.19 GB / 15.33 GB\r\n Binaries:\r\n Node: 20.1.0 - C:\\Program Files\\nodejs\\node.EXE\r\n npm: 9.6.4 - C:\\Program Files\\nodejs\\npm.CMD\r\n Browsers:\r\n Edge: Spartan (44.22621.1702.0), Chromium (114.0.1823.43)\r\n Internet Explorer: 11.0.22621.1\r\n npmPackages:\r\n @vueuse/core: ^10.1.2 => 10.1.2\r\n @vueuse/nuxt: ^10.1.2 => 10.1.2\r\n vue: ^3.3.2 => 3.3.4\r\n```\r\n\r\n\r\n### Used Package Manager\r\n\r\nnpm\r\n\r\n### Validations\r\n\r\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://vueuse.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/vueuse/vueuse/issues) that reports the same bug to avoid creating a duplicate.\r\n- [X] Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.\r\n- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vueuse/vueuse/discussions).\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],3158,"refDebounced doesn't work with objects","2024-05-14T16:08:53Z","https://github.com/vueuse/vueuse/issues/3158",0.7416544,{"description":2984,"labels":2985,"number":2986,"owner":2925,"repository":2925,"state":2970,"title":2987,"updated_at":2988,"url":2989,"score":2990},"### Describe the bug\n\nWhen reusing a defined template with props that have hyphens, VueUse does not pass them as camelCase props into the template slot.\n\n### Reproduction\n\nhttps://stackblitz.com/edit/vitejs-vite-hagbpn/?file=src%2FApp.vue\n\n### System Info\n\n```Shell\nSystem:\r\n OS: Linux 5.0 undefined\r\n CPU: (2) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz\r\n Memory: 0 Bytes / 0 Bytes\r\n Shell: 1.0 - /bin/jsh\r\n Binaries:\r\n Node: 16.20.0 - /usr/local/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 9.4.2 - /usr/local/bin/npm\r\n pnpm: 8.6.3 - /usr/local/bin/pnpm\r\n npmPackages:\r\n @vueuse/core: ^10.2.1 => 10.2.1 \r\n vue: ^3.2.25 => 3.2.31\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Validations\n\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://vueuse.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/vueuse/vueuse/issues) that reports the same bug to avoid creating a duplicate.\n- [X] Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.\n- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vueuse/vueuse/discussions).\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],3261,"`createReusableTemplate` does not support hyphened props","2023-07-30T13:50:38Z","https://github.com/vueuse/vueuse/issues/3261",0.7491667,{"description":2992,"labels":2993,"number":2994,"owner":2925,"repository":2925,"state":2970,"title":2995,"updated_at":2996,"url":2997,"score":2998},"### Describe the bug\n\ntrace: header -> functions -> ADD-ONS\r\n\r\n```js\r\nconst AddonCategories = [\r\n ...addonCategoryNames\r\n .map(c => ({\r\n text: c.slice(1),\r\n activeMatch: '___', // never active\r\n link: `/functions#category=${encodeURIComponent(c)}`,\r\n })),\r\n { text: 'Head', link: '/add-ons.html#head-vueuse-head' },\r\n { text: 'Motion', link: '/add-ons.html#motion-vueuse-motion' },\r\n { text: 'Gesture', link: '/add-ons.html#gesture-vueuse-gesture' },\r\n { text: 'Sound', link: '/add-ons.html#sound-vueuse-sound' },\r\n]\r\n```\n\n### Reproduction\n\nhttps://vueuse.org/\n\n### System Info\n\n```Shell\nchrome\n```\n\n\n### Used Package Manager\n\npnpm\n\n### Validations\n\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://vueuse.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/vueuse/vueuse/issues) that reports the same bug to avoid creating a duplicate.\n- [X] Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.\n- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vueuse/vueuse/discussions).\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],1393,"website AddonCategories has repeat title","2022-03-11T07:46:38Z","https://github.com/vueuse/vueuse/issues/1393",0.75219756,{"description":2992,"labels":3000,"number":3001,"owner":2925,"repository":2925,"state":2970,"title":2995,"updated_at":3002,"url":3003,"score":2998},[],1394,"2022-03-11T07:55:05Z","https://github.com/vueuse/vueuse/issues/1394",{"description":3005,"labels":3006,"number":3008,"owner":2925,"repository":2925,"state":2970,"title":3009,"updated_at":3010,"url":3011,"score":3012},"### Clear and concise description of the problem\n\nAs a developer using VueUse I want be able to modify the documents `\u003Cmeta>` tag for a single page. This allows me to set individual meta tags such as `\u003Cmeta name=\"referrer\" …>`.\r\n\r\nI can also contribute.\n\n### Suggested solution\n\nThe implementation could be similar to `useTitle` like this:\r\n\r\n```\r\nconst meta = useMeta({ name: 'referrer', content: 'origin' })\r\n```\n\n### Alternative\n\n_No response_\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://vueuse.org/guide).\n- [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.",[3007],{"name":2922,"color":2923},2878,"useMeta to modify documents \u003Cmeta>","2023-05-24T18:19:33Z","https://github.com/vueuse/vueuse/issues/2878",0.7567408,["Reactive",3014],{},["Set"],["ShallowReactive",3017],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fUgIb6Y-txGWDdOzhTSpMACoRvhDcw9DmLlayd3iZOxs":-1},"/vueuse/vueuse/4453"]