vue-emit-helper
Helper functions for emitting values from Vue component using composition API.
Installation
Synopsis
Please see full example on GitHub or CodeSandbox
template div input v-model="unitPrice" / input v-model="quantity" / input ... v-on="listeners" / input :value="value.modifications[default]" @input="emitWith(`modifications.${default}`, $event)" / /div/template script lang="ts"; /script
Details
Using Vue composition API, provides helper functions which emits (immutable) values with deep objects/arrays/Maps.
Also provides functions which returns values used as v-model
, which emits configured event automatically.
For example:
; ; // Approximately equal to:
API
vue-emit-helper
Functions
useEmitHelper
▸ useEmitHelper<P, PK>(props
: P, context
: SetupContext, __namedParameters
: object): EmitHelper
Defined in index.ts:75
Creates helper functions for emitting values from Vue component.
Example
template div v-numeric v-model="unitPrice" / v-numeric v-model="quantity" / v-numeric ... v-on="listeners" / v-amount :value="value.modifications[default]" @input="emitWith(`modifications.${default}`, $event)" / /div/template script lang="ts"; /script
Type parameters:
▪ P: Record‹string, any›
▪ PK: keyof P
Parameters:
▪ props: P
is props of Vue component passed to setup()
function.
▪ context: SetupContext
is setup context of Vue component passed to setup()
function.
▪Default value
__namedParameters: object= {}
Name | Type | Default |
---|---|---|
event |
string | "input" |
prop |
PK | "value" as PK |
Returns: EmitHelper
helper functions.
Interfaces
Interface: EmitHelper
Hierarchy
- EmitHelper
Properties
attrs
• attrs: Ref‹Record‹string, string››
Defined in index.ts:34
Computed value of object of attrs except value of emitted event. This is used to prevent down passing of emiited value.
emitWith
• emitWith: function
Defined in index.ts:12
Emits props.value
after immutably setting given attribute
to given value.
If new value passed is undefined
, it deletes related key instead of setting it to undefined
.
param
is the attribute name or path in props.value
.
param
is the new value to be set, or undefined
to delete related key from props.value
.
Type declaration:
▸ (attribute
: Path, value?
: any): void
Parameters:
Name | Type |
---|---|
attribute |
Path |
value? |
any |
getVModel
• getVModel: function
Defined in index.ts:30
Returns vue computed
value to be used target of a v-model
which emits immutable value with new value of the given attribute.
If new value passed to v-model
is undefined
, it deletes related key instead of setting it to undefined
.
Example
;; // getVModel("item.quantity") is approximately equal to:
param
is the attribute name or path in props.value
.
returns
computed
value.
Type declaration:
▸ (attribute?
: Path): Ref‹any›
Parameters:
Name | Type |
---|---|
attribute? |
Path |
listeners
• listeners: Ref‹Record‹string, Function››
Defined in index.ts:32
Computed value of object of events except emitted event. This is used to prevent down passing of emiited event.