Skip to content

reactiveOmit

Category
Export Size
395 B
Last Changed
3 weeks ago

Reactively omit fields from a reactive object.

Usage

Basic Usage

ts
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

ts
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

vue
<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

ts
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
>

Source

SourceDocs

Contributors

Anthony Fu
Anthony Fu
Arthur Darkstone
SerKo
Robin
Doctorwu
丶远方
Brain777777
qiang

Changelog

v14.0.0-alpha.3 on
554b7 - fix: update return types for createTemplatePromise, useMagicKeys, use… (#4963)
v13.1.0 on
c1d6e - feat(shared): ensure return types exists (#4659)
v12.3.0 on
59f75 - feat(toValue): deprecate toValue from @vueuse/shared in favor of Vue's native
v12.0.0-beta.1 on
0a9ed - feat!: drop Vue 2 support, optimize bundles and clean up (#4349)
Turn AI into a coding partner
Claim 40% off for AIDD Masterclass.
Get discount