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 |
reactiveOmit
Reactively omit fields from a reactive object.
Usage
Basic Usage
import { reactiveOmit } from '@vueuse/core';
const obj = reactive({
x: 0,
y: 0,
elementX: 0,
elementY: 0,
});
const picked = reactiveOmit(obj, 'x', 'elementX'); // { y: number, elementY: number }
Predicate Usage
import { reactiveOmit } from '@vueuse/core';
const obj = reactive({
bar: 'bar',
baz: 'should be omit',
foo: 'foo2',
qux: true,
});
const picked = reactiveOmit(obj, (value, key) => key === 'baz' || value === true);
// { bar: string, foo: string }
Scenarios
Selectively passing props to child
<script setup lang="ts">
import { reactiveOmit } from '@vueuse/core';
const props = defineProps<{
value: string;
color?: string;
font?: string;
}>();
const childProps = reactiveOmit(props, 'value');
</script>
<template>
<div>
<!-- only passes "color" and "font" props to child -->
<ChildComp v-bind="childProps" />
</div>
</template>
Type Declarations
export type ReactiveOmitReturn<T extends object, K extends keyof T | undefined = undefined> = [
K,
] extends [undefined]
? Partial<T>
: Omit<T, Extract<K, keyof T>>;
export type ReactiveOmitPredicate<T> = (value: T[keyof T], key: keyof T) => boolean;
export declare function reactiveOmit<T extends object, K extends keyof T>(
obj: T,
...keys: (K | K[])[]
): ReactiveOmitReturn<T, K>;
export declare function reactiveOmit<T extends object>(
obj: T,
predicate: ReactiveOmitPredicate<T>,
): ReactiveOmitReturn<T>;