fargo
1a822493ba
963 markdown files reformatted with the repository's pinned prettier so pnpm format:check covers the folded tree like every other repo file. The formatter's embedded-language pass also normalized code fences (TS semicolons, closed HTML tags in examples, lowercased CSS hex colors, one renumbered list that skipped an index). Alphanumeric token deltas vs the fold commit were audited file-by-file; all are formatter-equivalent markup normalizations plus the four sanitized skills.
1.6 KiB
1.6 KiB
category
| category |
|---|
| Reactivity |
extendRef
Add extra attributes to Ref.
Usage
Please note the extra attribute will not be accessible in Vue's template.
import { extendRef } from '@vueuse/core';
import { shallowRef } from 'vue';
const myRef = shallowRef('content');
const extended = extendRef(myRef, { foo: 'extra data' });
extended.value === 'content';
extended.foo === 'extra data';
Refs will be unwrapped and be reactive
import { extendRef } from '@vueuse/core';
// ---cut---
const myRef = shallowRef('content');
const extraRef = shallowRef('extra');
const extended = extendRef(myRef, { extra: extraRef });
extended.value === 'content';
extended.extra === 'extra';
extended.extra = 'new data'; // will trigger update
extraRef.value === 'new data';
Type Declarations
export type ExtendRefReturn<T = any> = Ref<T>;
export interface ExtendRefOptions<Unwrap extends boolean = boolean> {
/**
* Is the extends properties enumerable
*
* @default false
*/
enumerable?: boolean;
/**
* Unwrap for Ref properties
*
* @default true
*/
unwrap?: Unwrap;
}
/**
* Overload 1: Unwrap set to false
*/
export declare function extendRef<
R extends Ref<any>,
Extend extends object,
Options extends ExtendRefOptions<false>,
>(ref: R, extend: Extend, options?: Options): ShallowUnwrapRef<Extend> & R;
/**
* Overload 2: Unwrap unset or set to true
*/
export declare function extendRef<
R extends Ref<any>,
Extend extends object,
Options extends ExtendRefOptions,
>(ref: R, extend: Extend, options?: Options): Extend & R;