Class: InlineImageField

InlineImageField component provides an image upload field with drag-and-drop support, file type validation, automatic image reduction, and customizable dropzone styling.

Features:

• Drag-and-drop file upload from external sources (Finder/Explorer)
• File type validation with customizable accepted types
• Automatic image reduction for non-SVG images (max 1024px)
• SVG passthrough without modification
• Hover overlay with customizable placeholder
• Visual drag feedback with themed border styling
• File picker integration with modern showPicker API fallback

Remarks

• Uses ImageBlobReduce for automatic image optimization
• Registers global window/document listeners to detect external drags
• Supports theme color integration via Vuetify's useTheme
• Extends BaseField for consistent field behavior
• Cleans up all event listeners on component unmount

Example

<InlineImageField
  v-model="imageData"
  label="Profile Picture"
  accept="image/png,image/jpeg"
  :image-aspect-ratio="1"
  dropzone-border-color="primary"
  placeholder="Drop an image or click to upload"
/>

Properties

Property	Modifier	Type	Description
$	public	ComponentInternalInstance	-
$attrs	public	Data	-
$data	public	{ }	-
$el	public	any	-
$emit	public	(event: "update:modelValue", ...args: [string | null]) => void & (event: "update:model-value", ...args: [string | null]) => void & (event: "invalid-file-type", ...args: [string, string[]]) => void & (event: "click:clear", ...args: [MouseEvent]) => void & (event: "click:appendInner", ...args: [MouseEvent]) => void & (event: "click:prependInner", ...args: [MouseEvent]) => void & (event: "click:control", ...args: [MouseEvent]) => void & (event: "mousedown:control", ...args: [MouseEvent]) => void & (event: "update:focused", ...args: [boolean]) => void	-
$forceUpdate	public	() => void	-
$host	public	Element | null	-
$nextTick	public	{ (): Promise<void>; <T, R> (this: T, fn: (this: T) => R | Promise<R>): Promise<R>; }	-
$options	public	ComponentOptionsBase<ToResolvedProps<ExtractPropTypes<AppendDefault<{ accept: { default: string; type: PropType<string | string[]>; }; active: BooleanConstructor; appendIcon: PropType<IconValue>; appendInnerIcon: PropType<IconValue>; autofocus: { default: boolean; type: PropType<boolean>; }; baseColor: StringConstructor; bgColor: StringConstructor; callOnClickAppendInner: { default: () => never[]; type: PropType<BaseClickAppendInnerHookHandler[]>; }; callOnClickClear: { default: () => never[]; type: PropType<BaseClickClearHookHandler[]>; }; callOnClickControl: { default: () => never[]; type: PropType<BaseClickControlHookHandler[]>; }; callOnClickPrependInner: { default: () => never[]; type: PropType<BaseClickPrependInnerHookHandler[]>; }; callOnInvalidFileType: { default: () => never[]; type: PropType<InlineImageFieldHookHandlers<"invalid-file-type">[]>; }; callOnMousedownControl: { default: () => never[]; type: PropType<BaseMousedownControlHookHandler[]>; }; callOnUpdateFocused: { default: () => never[]; type: PropType<BaseUpdateFocusedHookHandler[]>; }; callOnUpdateModelValue: { default: () => never[]; type: PropType<BaseUpdateModelValueHookHandler[]>; }; centerAffix: { default: undefined; type: BooleanConstructor; }; class: PropType<any>; clearable: BooleanConstructor; clearIcon: { default: string; type: PropType<IconValue>; }; color: StringConstructor; density: { default: string; type: PropType<Density>; validator: (v: any) => boolean; }; direction: { default: string; type: PropType<"horizontal" | "vertical">; validator: (v: any) => boolean; }; dirty: BooleanConstructor; disabled: { default: null; type: BooleanConstructor; }; dropzoneBorderColor: { default: string; type: PropType<Color>; }; dropzoneBorderStyle: { default: string; type: PropType<string>; }; dropzoneBorderThickness: { default: number; type: PropType<string | number>; }; error: BooleanConstructor; errorMessages: { default: () => never[]; type: PropType<string | readonly string[] | null>; }; flat: BooleanConstructor; focused: BooleanConstructor; glow: BooleanConstructor; height: (StringConstructor | NumberConstructor)[]; hideDetails: PropType<boolean | "auto">; hideSpinButtons: BooleanConstructor; hint: StringConstructor; iconColor: (BooleanConstructor | StringConstructor)[]; id: StringConstructor; imageAspectRatio: { default: undefined; type: PropType<string | number | undefined>; }; isFocused: { default: undefined; type: PropType<(e: MouseEvent) => boolean | undefined>; }; label: StringConstructor; loading: (BooleanConstructor | StringConstructor)[]; maxErrors: { default: number; type: (StringConstructor | NumberConstructor)[]; }; maxHeight: (StringConstructor | NumberConstructor)[]; maxWidth: (StringConstructor | NumberConstructor)[]; messages: { default: () => never[]; type: PropType<string | readonly string[]>; }; minHeight: (StringConstructor | NumberConstructor)[]; minWidth: (StringConstructor | NumberConstructor)[]; modelValue: { default: null; type: PropType<string | null>; }; name: StringConstructor; onClick:append: PropType<(args_0: MouseEvent) => void>; onClick:appendInner?: PropType<(...args: [...]) => void | undefined>; onClick:clear?: PropType<(...args: [...]) => void | undefined>; onClick:control?: PropType<(...args: [...]) => void | undefined>; onClick:prepend: PropType<(args_0: MouseEvent) => void>; onClick:prependInner?: PropType<(...args: [...]) => void | undefined>; onInvalid-file-type?: PropType<(...args: [..., ...]) => void | undefined>; onMousedown:control?: PropType<(...args: [...]) => void | undefined>; onUpdate:focused?: PropType<(...args: [...]) => void | undefined>; onUpdate:model-value?: PropType<(...args: [...]) => void | undefined>; onUpdate:modelValue?: PropType<(...args: [...]) => void | undefined>; persistentClear: BooleanConstructor; persistentHint: BooleanConstructor; placeholder: { default: undefined; type: PropType<string | undefined>; }; prefix: { default: undefined; type: PropType<string | undefined>; }; prependIcon: PropType<IconValue>; prependInnerIcon: PropType<IconValue>; readonly: { default: null; type: PropType<boolean | null>; }; reverse: BooleanConstructor; role: { default: undefined; type: PropType<string | undefined>; }; rounded: { default: undefined; type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; }; rules: { default: () => never[]; type: PropType<readonly ( | string | boolean | PromiseLike<...> | (value: ...) => ... | (value: ...) => ... | [..., ..., ...?])[]>; }; singleLine: BooleanConstructor; style: { default: null; type: PropType<StyleValue>; }; suffix: { default: undefined; type: PropType<string | undefined>; }; theme: StringConstructor; tile: BooleanConstructor; validateOn: PropType< | "input" | "blur" | "submit" | "invalid-input" | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input" | "lazy" | "eager" | undefined>; validationValue: null; variant: Omit<{ default: string; type: PropType<... | ... | ... | ... | ... | ... | ...>; validator: (v: any) => boolean; }, "default" | "type"> & { default: NonNullable< | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain">; type: PropType< | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain">; }; width: (StringConstructor | NumberConstructor)[]; }, { }>>, EmitFunctions<{ click:appendInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:clear: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:prependInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; invalid-file-type: (type: string, acceptedTypes: string[]) => boolean; mousedown:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; update:focused: (focused: boolean) => boolean; update:model-value: (value: string | null) => boolean; update:modelValue: (value: string | null) => boolean; }>>, { }, { }, { }, { }, ComponentOptionsMixin, ComponentOptionsMixin, EmitFunctions<{ click:appendInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:clear: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:prependInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; invalid-file-type: (type: string, acceptedTypes: string[]) => boolean; mousedown:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; update:focused: (focused: boolean) => boolean; update:model-value: (value: string | null) => boolean; update:modelValue: (value: string | null) => boolean; }>, string, { accept: string | string[]; active: boolean; autofocus: boolean; callOnClickAppendInner: BaseClickAppendInnerHookHandler[]; callOnClickClear: BaseClickClearHookHandler[]; callOnClickControl: BaseClickControlHookHandler[]; callOnClickPrependInner: BaseClickPrependInnerHookHandler[]; callOnInvalidFileType: InlineImageFieldHookHandlers<"invalid-file-type">[]; callOnMousedownControl: BaseMousedownControlHookHandler[]; callOnUpdateFocused: BaseUpdateFocusedHookHandler[]; callOnUpdateModelValue: BaseUpdateModelValueHookHandler[]; centerAffix: boolean; clearable: boolean; clearIcon: IconValue; density: Density; direction: "horizontal" | "vertical"; dirty: boolean; disabled: boolean; dropzoneBorderColor: Color; dropzoneBorderStyle: string; dropzoneBorderThickness: string | number; error: boolean; errorMessages: string | readonly string[] | null; flat: boolean; focused: boolean; glow: boolean; hideSpinButtons: boolean; imageAspectRatio: string | number | undefined; isFocused: (e: MouseEvent) => boolean | undefined; maxErrors: string | number; messages: string | readonly string[]; modelValue: string | null; persistentClear: boolean; persistentHint: boolean; placeholder: string | undefined; prefix: string | undefined; readonly: boolean | null; reverse: boolean; role: string | undefined; rounded: string | number | boolean; rules: readonly ( | string | boolean | PromiseLike<ValidationResult> | (value: any) => ValidationResult | (value: any) => PromiseLike<ValidationResult> | [string, any, string?])[]; singleLine: boolean; style: StyleValue; suffix: string | undefined; tile: boolean; variant: | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain"; }, { }, string, SlotsType<InlineImageFieldSlots>, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & MergedComponentOptionsOverride	-
$parent	public	| ComponentPublicInstance<{ }, { }, { }, { }, { }, { }, { }, { }, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, { }, { }, string, { }, { }, { }, string, ComponentProvideOptions>, { }, { }, "", { }, any> | null	-
$props	public	Partial<{ accept: string | string[]; active: boolean; autofocus: boolean; callOnClickAppendInner: BaseClickAppendInnerHookHandler[]; callOnClickClear: BaseClickClearHookHandler[]; callOnClickControl: BaseClickControlHookHandler[]; callOnClickPrependInner: BaseClickPrependInnerHookHandler[]; callOnInvalidFileType: InlineImageFieldHookHandlers<"invalid-file-type">[]; callOnMousedownControl: BaseMousedownControlHookHandler[]; callOnUpdateFocused: BaseUpdateFocusedHookHandler[]; callOnUpdateModelValue: BaseUpdateModelValueHookHandler[]; centerAffix: boolean; clearable: boolean; clearIcon: IconValue; density: Density; direction: "horizontal" | "vertical"; dirty: boolean; disabled: boolean; dropzoneBorderColor: Color; dropzoneBorderStyle: string; dropzoneBorderThickness: string | number; error: boolean; errorMessages: string | readonly string[] | null; flat: boolean; focused: boolean; glow: boolean; hideSpinButtons: boolean; imageAspectRatio: string | number | undefined; isFocused: (e: MouseEvent) => boolean | undefined; maxErrors: string | number; messages: string | readonly string[]; modelValue: string | null; persistentClear: boolean; persistentHint: boolean; placeholder: string | undefined; prefix: string | undefined; readonly: boolean | null; reverse: boolean; role: string | undefined; rounded: string | number | boolean; rules: readonly ( | string | boolean | PromiseLike<ValidationResult> | (value: any) => ValidationResult | (value: any) => PromiseLike<ValidationResult> | [string, any, string?])[]; singleLine: boolean; style: StyleValue; suffix: string | undefined; tile: boolean; variant: | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain"; }> & Omit<{ accept: string | string[]; active: boolean; appendIcon?: IconValue; appendInnerIcon?: IconValue; autofocus: boolean; baseColor?: string; bgColor?: string; callOnClickAppendInner: BaseClickAppendInnerHookHandler[]; callOnClickClear: BaseClickClearHookHandler[]; callOnClickControl: BaseClickControlHookHandler[]; callOnClickPrependInner: BaseClickPrependInnerHookHandler[]; callOnInvalidFileType: InlineImageFieldHookHandlers<"invalid-file-type">[]; callOnMousedownControl: BaseMousedownControlHookHandler[]; callOnUpdateFocused: BaseUpdateFocusedHookHandler[]; callOnUpdateModelValue: BaseUpdateModelValueHookHandler[]; centerAffix?: boolean; class?: any; clearable: boolean; clearIcon: IconValue; color?: string; density: Density; direction: "horizontal" | "vertical"; dirty: boolean; disabled: boolean; dropzoneBorderColor: Color; dropzoneBorderStyle: string; dropzoneBorderThickness: string | number; error: boolean; errorMessages: string | readonly string[] | null; flat: boolean; focused: boolean; glow: boolean; height?: string | number; hideDetails?: boolean | "auto"; hideSpinButtons: boolean; hint?: string; iconColor?: string | boolean; id?: string; imageAspectRatio?: string | number; isFocused?: (e: MouseEvent) => boolean; label?: string; loading?: string | boolean; maxErrors: string | number; maxHeight?: string | number; maxWidth?: string | number; messages: string | readonly string[]; minHeight?: string | number; minWidth?: string | number; modelValue: string | null; name?: string; onClick:append?: (args_0: MouseEvent) => void; onClick:appendInner?: (...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any; onClick:clear?: (...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any; onClick:control?: (...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any; onClick:prepend?: (args_0: MouseEvent) => void; onClick:prependInner?: (...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any; onInvalid-file-type?: (...args: [string, string[]]) => void & (...args: [string, string[]]) => any; onMousedown:control?: (...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any; onUpdate:focused?: (...args: [boolean]) => void & (...args: [boolean]) => any; onUpdate:model-value?: (...args: [string | null]) => void & (...args: [string | null]) => any; onUpdate:modelValue?: (...args: [string | null]) => void & (...args: [string | null]) => any; persistentClear: boolean; persistentHint: boolean; placeholder?: string; prefix?: string; prependIcon?: IconValue; prependInnerIcon?: IconValue; readonly: boolean | null; reverse: boolean; role?: string; rounded?: string | number | boolean; rules: readonly ( | string | boolean | PromiseLike<ValidationResult> | (value: any) => ValidationResult | (value: any) => PromiseLike<ValidationResult> | [string, any, string?])[]; singleLine: boolean; style: string | false | CSSProperties | StyleValue[] | null; suffix?: string; theme?: string; tile: boolean; validateOn?: | "input" | "blur" | "submit" | "invalid-input" | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input" | "lazy" | "eager"; validationValue?: any; variant: | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain"; width?: string | number; } & VNodeProps & AllowedComponentProps & ComponentCustomProps, DefaultKeys<AppendDefault<{ accept: { default: string; type: PropType<string | string[]>; }; active: BooleanConstructor; appendIcon: PropType<IconValue>; appendInnerIcon: PropType<IconValue>; autofocus: { default: boolean; type: PropType<boolean>; }; baseColor: StringConstructor; bgColor: StringConstructor; callOnClickAppendInner: { default: () => never[]; type: PropType<BaseClickAppendInnerHookHandler[]>; }; callOnClickClear: { default: () => never[]; type: PropType<BaseClickClearHookHandler[]>; }; callOnClickControl: { default: () => never[]; type: PropType<BaseClickControlHookHandler[]>; }; callOnClickPrependInner: { default: () => never[]; type: PropType<BaseClickPrependInnerHookHandler[]>; }; callOnInvalidFileType: { default: () => never[]; type: PropType<InlineImageFieldHookHandlers<"invalid-file-type">[]>; }; callOnMousedownControl: { default: () => never[]; type: PropType<BaseMousedownControlHookHandler[]>; }; callOnUpdateFocused: { default: () => never[]; type: PropType<BaseUpdateFocusedHookHandler[]>; }; callOnUpdateModelValue: { default: () => never[]; type: PropType<BaseUpdateModelValueHookHandler[]>; }; centerAffix: { default: undefined; type: BooleanConstructor; }; class: PropType<any>; clearable: BooleanConstructor; clearIcon: { default: string; type: PropType<IconValue>; }; color: StringConstructor; density: { default: string; type: PropType<Density>; validator: (v: any) => boolean; }; direction: { default: string; type: PropType<"horizontal" | "vertical">; validator: (v: any) => boolean; }; dirty: BooleanConstructor; disabled: { default: null; type: BooleanConstructor; }; dropzoneBorderColor: { default: string; type: PropType<Color>; }; dropzoneBorderStyle: { default: string; type: PropType<string>; }; dropzoneBorderThickness: { default: number; type: PropType<string | number>; }; error: BooleanConstructor; errorMessages: { default: () => never[]; type: PropType<string | readonly string[] | null>; }; flat: BooleanConstructor; focused: BooleanConstructor; glow: BooleanConstructor; height: (StringConstructor | NumberConstructor)[]; hideDetails: PropType<boolean | "auto">; hideSpinButtons: BooleanConstructor; hint: StringConstructor; iconColor: (BooleanConstructor | StringConstructor)[]; id: StringConstructor; imageAspectRatio: { default: undefined; type: PropType<string | number | undefined>; }; isFocused: { default: undefined; type: PropType<(e: MouseEvent) => boolean | undefined>; }; label: StringConstructor; loading: (BooleanConstructor | StringConstructor)[]; maxErrors: { default: number; type: (StringConstructor | NumberConstructor)[]; }; maxHeight: (StringConstructor | NumberConstructor)[]; maxWidth: (StringConstructor | NumberConstructor)[]; messages: { default: () => never[]; type: PropType<string | readonly string[]>; }; minHeight: (StringConstructor | NumberConstructor)[]; minWidth: (StringConstructor | NumberConstructor)[]; modelValue: { default: null; type: PropType<string | null>; }; name: StringConstructor; onClick:append: PropType<(args_0: MouseEvent) => void>; onClick:appendInner?: PropType<(...args: [MouseEvent]) => void | undefined>; onClick:clear?: PropType<(...args: [MouseEvent]) => void | undefined>; onClick:control?: PropType<(...args: [MouseEvent]) => void | undefined>; onClick:prepend: PropType<(args_0: MouseEvent) => void>; onClick:prependInner?: PropType<(...args: [MouseEvent]) => void | undefined>; onInvalid-file-type?: PropType<(...args: [string, ...[]]) => void | undefined>; onMousedown:control?: PropType<(...args: [MouseEvent]) => void | undefined>; onUpdate:focused?: PropType<(...args: [boolean]) => void | undefined>; onUpdate:model-value?: PropType<(...args: [... | ...]) => void | undefined>; onUpdate:modelValue?: PropType<(...args: [... | ...]) => void | undefined>; persistentClear: BooleanConstructor; persistentHint: BooleanConstructor; placeholder: { default: undefined; type: PropType<string | undefined>; }; prefix: { default: undefined; type: PropType<string | undefined>; }; prependIcon: PropType<IconValue>; prependInnerIcon: PropType<IconValue>; readonly: { default: null; type: PropType<boolean | null>; }; reverse: BooleanConstructor; role: { default: undefined; type: PropType<string | undefined>; }; rounded: { default: undefined; type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; }; rules: { default: () => never[]; type: PropType<readonly ( | string | boolean | PromiseLike<ValidationResult> | (value: any) => ValidationResult | (value: any) => PromiseLike<...> | [string, any, (... | ...)?])[]>; }; singleLine: BooleanConstructor; style: { default: null; type: PropType<StyleValue>; }; suffix: { default: undefined; type: PropType<string | undefined>; }; theme: StringConstructor; tile: BooleanConstructor; validateOn: PropType< | "input" | "blur" | "submit" | "invalid-input" | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input" | "lazy" | "eager" | undefined>; validationValue: null; variant: Omit<{ default: string; type: PropType< | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain">; validator: (v: any) => boolean; }, "default" | "type"> & { default: NonNullable< | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain">; type: PropType< | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain">; }; width: (StringConstructor | NumberConstructor)[]; }, { }>>>	-
$refs	public	Data	-
$root	public	| ComponentPublicInstance<{ }, { }, { }, { }, { }, { }, { }, { }, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, { }, { }, string, { }, { }, { }, string, ComponentProvideOptions>, { }, { }, "", { }, any> | null	-
$slots	public	UnwrapSlotsType<S>	-
$vuetify	public	Vuetify	-
accept	readonly	string | string[]	-
active	readonly	boolean	-
appendIcon?	readonly	IconValue	-
appendInnerIcon?	readonly	IconValue	-
autofocus	readonly	boolean	-
baseColor?	readonly	string	-
bgColor?	readonly	string	-
callOnClickAppendInner	readonly	BaseClickAppendInnerHookHandler[]	-
callOnClickClear	readonly	BaseClickClearHookHandler[]	-
callOnClickControl	readonly	BaseClickControlHookHandler[]	-
callOnClickPrependInner	readonly	BaseClickPrependInnerHookHandler[]	-
callOnInvalidFileType	readonly	InlineImageFieldHookHandlers<"invalid-file-type">[]	-
callOnMousedownControl	readonly	BaseMousedownControlHookHandler[]	-
callOnUpdateFocused	readonly	BaseUpdateFocusedHookHandler[]	-
callOnUpdateModelValue	readonly	BaseUpdateModelValueHookHandler[]	-
centerAffix	readonly	boolean	-
class?	readonly	any	-
clearable	readonly	boolean	-
clearIcon	readonly	IconValue	-
color?	readonly	string	-
density	readonly	Density	-
direction	readonly	"horizontal" | "vertical"	-
dirty	readonly	boolean	-
disabled	readonly	boolean	-
dropzoneBorderColor	readonly	Color	-
dropzoneBorderStyle	readonly	string	-
dropzoneBorderThickness	readonly	string | number	-
error	readonly	boolean	-
errorMessages	readonly	string | readonly string[] | null	-
flat	readonly	boolean	-
focused	readonly	boolean	-
glow	readonly	boolean	-
height?	readonly	string | number	-
hideDetails?	readonly	boolean | "auto"	-
hideSpinButtons	readonly	boolean	-
hint?	readonly	string	-
iconColor?	readonly	string | boolean	-
id?	readonly	string	-
imageAspectRatio	readonly	string | number | undefined	-
isFocused	readonly	(e: MouseEvent) => boolean | undefined	-
label?	readonly	string	-
loading?	readonly	string | boolean	-
maxErrors	readonly	string | number	-
maxHeight?	readonly	string | number	-
maxWidth?	readonly	string | number	-
messages	readonly	string | readonly string[]	-
minHeight?	readonly	string | number	-
minWidth?	readonly	string | number	-
modelValue	readonly	string | null	-
name?	readonly	string	-
onClick:append?	readonly	(args_0: MouseEvent) => void	-
onClick:appendInner?	public	(...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any	-
onClick:clear?	public	(...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any	-
onClick:control?	public	(...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any	-
onClick:prepend?	readonly	(args_0: MouseEvent) => void	-
onClick:prependInner?	public	(...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any	-
onInvalid-file-type?	public	(...args: [string, string[]]) => void & (...args: [string, string[]]) => any	-
onMousedown:control?	public	(...args: [MouseEvent]) => void & (...args: [MouseEvent]) => any	-
onUpdate:focused?	public	(...args: [boolean]) => void & (...args: [boolean]) => any	-
onUpdate:model-value?	public	(...args: [string | null]) => void & (...args: [string | null]) => any	-
onUpdate:modelValue?	public	(...args: [string | null]) => void & (...args: [string | null]) => any	-
persistentClear	readonly	boolean	-
persistentHint	readonly	boolean	-
placeholder	readonly	string | undefined	-
prefix	readonly	string | undefined	-
prependIcon?	readonly	IconValue	-
prependInnerIcon?	readonly	IconValue	-
readonly	readonly	boolean | null	-
reverse	readonly	boolean	-
role	readonly	string | undefined	-
rounded	readonly	string | number | boolean	-
rules	readonly	readonly ( | string | boolean | PromiseLike<ValidationResult> | (value: any) => ValidationResult | (value: any) => PromiseLike<ValidationResult> | [string, any, string?])[]	-
singleLine	readonly	boolean	-
style	readonly	StyleValue	-
suffix	readonly	string | undefined	-
theme?	readonly	string	-
tile	readonly	boolean	-
validateOn?	readonly	| "input" | "blur" | "submit" | "invalid-input" | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input" | "lazy" | "eager"	-
validationValue?	readonly	any	-
variant	readonly	| "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain"	-
width?	readonly	string | number	-
__defaults?	static	{ accept: string | string[]; active: boolean; autofocus: boolean; callOnClickAppendInner: BaseClickAppendInnerHookHandler[]; callOnClickClear: BaseClickClearHookHandler[]; callOnClickControl: BaseClickControlHookHandler[]; callOnClickPrependInner: BaseClickPrependInnerHookHandler[]; callOnInvalidFileType: InlineImageFieldHookHandlers<"invalid-file-type">[]; callOnMousedownControl: BaseMousedownControlHookHandler[]; callOnUpdateFocused: BaseUpdateFocusedHookHandler[]; callOnUpdateModelValue: BaseUpdateModelValueHookHandler[]; centerAffix: boolean; clearable: boolean; clearIcon: IconValue; density: Density; direction: "horizontal" | "vertical"; dirty: boolean; disabled: boolean; dropzoneBorderColor: Color; dropzoneBorderStyle: string; dropzoneBorderThickness: string | number; error: boolean; errorMessages: string | readonly string[] | null; flat: boolean; focused: boolean; glow: boolean; hideSpinButtons: boolean; imageAspectRatio: string | number | undefined; isFocused: (e: MouseEvent) => boolean | undefined; maxErrors: string | number; messages: string | readonly string[]; modelValue: string | null; persistentClear: boolean; persistentHint: boolean; placeholder: string | undefined; prefix: string | undefined; readonly: boolean | null; reverse: boolean; role: string | undefined; rounded: string | number | boolean; rules: readonly ( | string | boolean | PromiseLike<ValidationResult> | (value: any) => ValidationResult | (value: any) => PromiseLike<ValidationResult> | [string, any, string?])[]; singleLine: boolean; style: StyleValue; suffix: string | undefined; tile: boolean; variant: | "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain"; }	-
__defaults.accept	public	string | string[]	-
__defaults.active	public	boolean	-
__defaults.autofocus	public	boolean	-
__defaults.callOnClickAppendInner	public	BaseClickAppendInnerHookHandler[]	-
__defaults.callOnClickClear	public	BaseClickClearHookHandler[]	-
__defaults.callOnClickControl	public	BaseClickControlHookHandler[]	-
__defaults.callOnClickPrependInner	public	BaseClickPrependInnerHookHandler[]	-
__defaults.callOnInvalidFileType	public	InlineImageFieldHookHandlers<"invalid-file-type">[]	-
__defaults.callOnMousedownControl	public	BaseMousedownControlHookHandler[]	-
__defaults.callOnUpdateFocused	public	BaseUpdateFocusedHookHandler[]	-
__defaults.callOnUpdateModelValue	public	BaseUpdateModelValueHookHandler[]	-
__defaults.centerAffix	public	boolean	-
__defaults.clearable	public	boolean	-
__defaults.clearIcon	public	IconValue	-
__defaults.density	public	Density	-
__defaults.direction	public	"horizontal" | "vertical"	-
__defaults.dirty	public	boolean	-
__defaults.disabled	public	boolean	-
__defaults.dropzoneBorderColor	public	Color	-
__defaults.dropzoneBorderStyle	public	string	-
__defaults.dropzoneBorderThickness	public	string | number	-
__defaults.error	public	boolean	-
__defaults.errorMessages	public	string | readonly string[] | null	-
__defaults.flat	public	boolean	-
__defaults.focused	public	boolean	-
__defaults.glow	public	boolean	-
__defaults.hideSpinButtons	public	boolean	-
__defaults.imageAspectRatio	public	string | number | undefined	-
__defaults.isFocused	public	(e: MouseEvent) => boolean | undefined	-
__defaults.maxErrors	public	string | number	-
__defaults.messages	public	string | readonly string[]	-
__defaults.modelValue	public	string | null	-
__defaults.persistentClear	public	boolean	-
__defaults.persistentHint	public	boolean	-
__defaults.placeholder	public	string | undefined	-
__defaults.prefix	public	string | undefined	-
__defaults.readonly	public	boolean | null	-
__defaults.reverse	public	boolean	-
__defaults.role	public	string | undefined	-
__defaults.rounded	public	string | number | boolean	-
__defaults.rules	public	readonly ( | string | boolean | PromiseLike<ValidationResult> | (value: any) => ValidationResult | (value: any) => PromiseLike<ValidationResult> | [string, any, string?])[]	-
__defaults.singleLine	public	boolean	-
__defaults.style	public	StyleValue	-
__defaults.suffix	public	string | undefined	-
__defaults.tile	public	boolean	-
__defaults.variant	public	| "underlined" | "outlined" | "filled" | "solo" | "solo-inverted" | "solo-filled" | "plain"	-
__differentiator?	static	undefined	#3468 type-only, used to assist Mixin's type inference, TypeScript will try to simplify the inferred Mixin type, with the __differentiator, TypeScript won't be able to combine different mixins, because the __differentiator will be different
__file?	static	string	This one should be exposed so that devtools can make use of it
__isBuiltIn?	static	boolean	Compat build only, for bailing out of certain compatibility behavior
__isFragment?	static	undefined	-
__isSuspense?	static	undefined	-
__isTeleport?	static	undefined	-
__name?	static	string	name inferred from filename
call?	static	(this: unknown, ...args: unknown[]) => never	-
class?	static	unknown	-
compatConfig?	static	CompatConfig	-
compilerOptions?	static	RuntimeCompilerOptions	-
components?	static	GlobalComponents & Record<string, Component<any, any, any, ComputedOptions, MethodOptions, { }, any>>	-
computed?	static	{ }	-
data?	static	(this: CreateComponentPublicInstanceWithMixins<ToResolvedProps<ExtractPropTypes<AppendDefault<{ accept: { default: string; type: PropType<string | ...[]>; }; active: BooleanConstructor; appendIcon: PropType<IconValue>; appendInnerIcon: PropType<IconValue>; autofocus: { default: boolean; type: PropType<boolean>; }; baseColor: StringConstructor; bgColor: StringConstructor; callOnClickAppendInner: { default: () => never[]; type: PropType<BaseClickAppendInnerHookHandler[]>; }; callOnClickClear: { default: () => never[]; type: PropType<BaseClickClearHookHandler[]>; }; callOnClickControl: { default: () => never[]; type: PropType<BaseClickControlHookHandler[]>; }; callOnClickPrependInner: { default: () => never[]; type: PropType<BaseClickPrependInnerHookHandler[]>; }; callOnInvalidFileType: { default: () => never[]; type: PropType<InlineImageFieldHookHandlers<...>[]>; }; callOnMousedownControl: { default: () => never[]; type: PropType<BaseMousedownControlHookHandler[]>; }; callOnUpdateFocused: { default: () => never[]; type: PropType<BaseUpdateFocusedHookHandler[]>; }; callOnUpdateModelValue: { default: () => never[]; type: PropType<BaseUpdateModelValueHookHandler[]>; }; centerAffix: { default: undefined; type: BooleanConstructor; }; class: PropType<any>; clearable: BooleanConstructor; clearIcon: { default: string; type: PropType<IconValue>; }; color: StringConstructor; density: { default: string; type: PropType<Density>; validator: (v: any) => boolean; }; direction: { default: string; type: PropType<"horizontal" | "vertical">; validator: (v: any) => boolean; }; dirty: BooleanConstructor; disabled: { default: null; type: BooleanConstructor; }; dropzoneBorderColor: { default: string; type: PropType<Color>; }; dropzoneBorderStyle: { default: string; type: PropType<string>; }; dropzoneBorderThickness: { default: number; type: PropType<string | number>; }; error: BooleanConstructor; errorMessages: { default: () => never[]; type: PropType<string | readonly ...[] | null>; }; flat: BooleanConstructor; focused: BooleanConstructor; glow: BooleanConstructor; height: (StringConstructor | NumberConstructor)[]; hideDetails: PropType<boolean | "auto">; hideSpinButtons: BooleanConstructor; hint: StringConstructor; iconColor: (BooleanConstructor | StringConstructor)[]; id: StringConstructor; imageAspectRatio: { default: undefined; type: PropType<string | number | undefined>; }; isFocused: { default: undefined; type: PropType<(e: ...) => ... | undefined>; }; label: StringConstructor; loading: (BooleanConstructor | StringConstructor)[]; maxErrors: { default: number; type: (StringConstructor | NumberConstructor)[]; }; maxHeight: (StringConstructor | NumberConstructor)[]; maxWidth: (StringConstructor | NumberConstructor)[]; messages: { default: () => never[]; type: PropType<string | readonly ...[]>; }; minHeight: (StringConstructor | NumberConstructor)[]; minWidth: (StringConstructor | NumberConstructor)[]; modelValue: { default: null; type: PropType<string | null>; }; name: StringConstructor; onClick:append: PropType<(args_0: MouseEvent) => void>; onClick:appendInner?: PropType<(...args: ...) => ... | undefined>; onClick:clear?: PropType<(...args: ...) => ... | undefined>; onClick:control?: PropType<(...args: ...) => ... | undefined>; onClick:prepend: PropType<(args_0: MouseEvent) => void>; onClick:prependInner?: PropType<(...args: ...) => ... | undefined>; onInvalid-file-type?: PropType<(...args: ...) => ... | undefined>; onMousedown:control?: PropType<(...args: ...) => ... | undefined>; onUpdate:focused?: PropType<(...args: ...) => ... | undefined>; onUpdate:model-value?: PropType<(...args: ...) => ... | undefined>; onUpdate:modelValue?: PropType<(...args: ...) => ... | undefined>; persistentClear: BooleanConstructor; persistentHint: BooleanConstructor; placeholder: { default: undefined; type: PropType<string | undefined>; }; prefix: { default: undefined; type: PropType<string | undefined>; }; prependIcon: PropType<IconValue>; prependInnerIcon: PropType<IconValue>; readonly: { default: null; type: PropType<boolean | null>; }; reverse: BooleanConstructor; role: { default: undefined; type: PropType<string | undefined>; }; rounded: { default: undefined; type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; }; rules: { default: () => never[]; type: PropType<readonly (... | ... | ... | ... | ... | ... | ...)[]>; }; singleLine: BooleanConstructor; style: { default: null; type: PropType<StyleValue>; }; suffix: { default: undefined; type: PropType<string | undefined>; }; theme: StringConstructor; tile: BooleanConstructor; validateOn: PropType< | "input" | "blur" | "submit" | "invalid-input" | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input" | "lazy" | "eager" | undefined>; validationValue: null; variant: Omit<{ default: string; type: PropType<...>; validator: (v: ...) => ...; }, "default" | "type"> & { default: NonNullable<... | ... | ... | ... | ... | ... | ...>; type: PropType<... | ... | ... | ... | ... | ... | ...>; }; width: (StringConstructor | NumberConstructor)[]; }, { }>>, EmitFunctions<{ click:appendInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:clear: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:prependInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; invalid-file-type: (type: string, acceptedTypes: string[]) => boolean; mousedown:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; update:focused: (focused: boolean) => boolean; update:model-value: (value: string | null) => boolean; update:modelValue: (value: string | null) => boolean; }>>, { }, { }, { }, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin>, vm: CreateComponentPublicInstanceWithMixins<ToResolvedProps<ExtractPropTypes<AppendDefault<{ accept: { default: string; type: PropType<string | ...[]>; }; active: BooleanConstructor; appendIcon: PropType<IconValue>; appendInnerIcon: PropType<IconValue>; autofocus: { default: boolean; type: PropType<boolean>; }; baseColor: StringConstructor; bgColor: StringConstructor; callOnClickAppendInner: { default: () => never[]; type: PropType<BaseClickAppendInnerHookHandler[]>; }; callOnClickClear: { default: () => never[]; type: PropType<BaseClickClearHookHandler[]>; }; callOnClickControl: { default: () => never[]; type: PropType<BaseClickControlHookHandler[]>; }; callOnClickPrependInner: { default: () => never[]; type: PropType<BaseClickPrependInnerHookHandler[]>; }; callOnInvalidFileType: { default: () => never[]; type: PropType<InlineImageFieldHookHandlers<...>[]>; }; callOnMousedownControl: { default: () => never[]; type: PropType<BaseMousedownControlHookHandler[]>; }; callOnUpdateFocused: { default: () => never[]; type: PropType<BaseUpdateFocusedHookHandler[]>; }; callOnUpdateModelValue: { default: () => never[]; type: PropType<BaseUpdateModelValueHookHandler[]>; }; centerAffix: { default: undefined; type: BooleanConstructor; }; class: PropType<any>; clearable: BooleanConstructor; clearIcon: { default: string; type: PropType<IconValue>; }; color: StringConstructor; density: { default: string; type: PropType<Density>; validator: (v: any) => boolean; }; direction: { default: string; type: PropType<"horizontal" | "vertical">; validator: (v: any) => boolean; }; dirty: BooleanConstructor; disabled: { default: null; type: BooleanConstructor; }; dropzoneBorderColor: { default: string; type: PropType<Color>; }; dropzoneBorderStyle: { default: string; type: PropType<string>; }; dropzoneBorderThickness: { default: number; type: PropType<string | number>; }; error: BooleanConstructor; errorMessages: { default: () => never[]; type: PropType<string | readonly ...[] | null>; }; flat: BooleanConstructor; focused: BooleanConstructor; glow: BooleanConstructor; height: (StringConstructor | NumberConstructor)[]; hideDetails: PropType<boolean | "auto">; hideSpinButtons: BooleanConstructor; hint: StringConstructor; iconColor: (BooleanConstructor | StringConstructor)[]; id: StringConstructor; imageAspectRatio: { default: undefined; type: PropType<string | number | undefined>; }; isFocused: { default: undefined; type: PropType<(e: ...) => ... | undefined>; }; label: StringConstructor; loading: (BooleanConstructor | StringConstructor)[]; maxErrors: { default: number; type: (StringConstructor | NumberConstructor)[]; }; maxHeight: (StringConstructor | NumberConstructor)[]; maxWidth: (StringConstructor | NumberConstructor)[]; messages: { default: () => never[]; type: PropType<string | readonly ...[]>; }; minHeight: (StringConstructor | NumberConstructor)[]; minWidth: (StringConstructor | NumberConstructor)[]; modelValue: { default: null; type: PropType<string | null>; }; name: StringConstructor; onClick:append: PropType<(args_0: MouseEvent) => void>; onClick:appendInner?: PropType<(...args: ...) => ... | undefined>; onClick:clear?: PropType<(...args: ...) => ... | undefined>; onClick:control?: PropType<(...args: ...) => ... | undefined>; onClick:prepend: PropType<(args_0: MouseEvent) => void>; onClick:prependInner?: PropType<(...args: ...) => ... | undefined>; onInvalid-file-type?: PropType<(...args: ...) => ... | undefined>; onMousedown:control?: PropType<(...args: ...) => ... | undefined>; onUpdate:focused?: PropType<(...args: ...) => ... | undefined>; onUpdate:model-value?: PropType<(...args: ...) => ... | undefined>; onUpdate:modelValue?: PropType<(...args: ...) => ... | undefined>; persistentClear: BooleanConstructor; persistentHint: BooleanConstructor; placeholder: { default: undefined; type: PropType<string | undefined>; }; prefix: { default: undefined; type: PropType<string | undefined>; }; prependIcon: PropType<IconValue>; prependInnerIcon: PropType<IconValue>; readonly: { default: null; type: PropType<boolean | null>; }; reverse: BooleanConstructor; role: { default: undefined; type: PropType<string | undefined>; }; rounded: { default: undefined; type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; }; rules: { default: () => never[]; type: PropType<readonly (... | ... | ... | ... | ... | ... | ...)[]>; }; singleLine: BooleanConstructor; style: { default: null; type: PropType<StyleValue>; }; suffix: { default: undefined; type: PropType<string | undefined>; }; theme: StringConstructor; tile: BooleanConstructor; validateOn: PropType< | "input" | "blur" | "submit" | "invalid-input" | "input lazy" | "blur lazy" | "submit lazy" | "invalid-input lazy" | "input eager" | "blur eager" | "submit eager" | "invalid-input eager" | "lazy input" | "lazy blur" | "lazy submit" | "lazy invalid-input" | "eager input" | "eager blur" | "eager submit" | "eager invalid-input" | "lazy" | "eager" | undefined>; validationValue: null; variant: Omit<{ default: string; type: PropType<...>; validator: (v: ...) => ...; }, "default" | "type"> & { default: NonNullable<... | ... | ... | ... | ... | ... | ...>; type: PropType<... | ... | ... | ... | ... | ... | ...>; }; width: (StringConstructor | NumberConstructor)[]; }, { }>>, EmitFunctions<{ click:appendInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:clear: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; click:prependInner: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; invalid-file-type: (type: string, acceptedTypes: string[]) => boolean; mousedown:control: (e: MouseEvent) => e is MouseEvent & { [key: string]: unknown }; update:focused: (focused: boolean) => boolean; update:model-value: (value: string | null) => boolean; update:modelValue: (value: string | null) => boolean; }>>, { }, { }, { }, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin>) => { }	-
delimiters?	static	[string, string]	runtime compile only Deprecated use compilerOptions.delimiters instead.
directives?	static	GlobalDirectives & Record<string, Directive<any, any, string, any>>	-
emits?	static	(string[] | EmitFunctions<{ 'update:modelValue': (value: string | null) => boolean; 'update:model-value': (value: string | null) => boolean; 'invalid-file-type': (type: string, acceptedTypes: string[]) => boolean; ... 5 more ...; 'update:focused': (focused: boolean) => boolean; }>) & ThisType<...>	-
errorCaptured?	static	ErrorCapturedHook<unknown>	-
expose?	static	string[]	-
extends?	static	ComponentOptionsMixin	-
filters?	static	Record<string, Function>	-
inheritAttrs?	static	boolean	-
inject?	static	| { } | string[]	-
key?	static	PropertyKey	-
methods?	static	{ }	-
mixins?	static	ComponentOptionsMixin[]	-
name?	static	string	-
onVnodeBeforeMount?	static	VNodeMountHook | VNodeMountHook[]	-
onVnodeBeforeUnmount?	static	VNodeMountHook | VNodeMountHook[]	-
onVnodeBeforeUpdate?	static	VNodeUpdateHook | VNodeUpdateHook[]	-
onVnodeMounted?	static	VNodeMountHook | VNodeMountHook[]	-
onVnodeUnmounted?	static	VNodeMountHook | VNodeMountHook[]	-
onVnodeUpdated?	static	VNodeUpdateHook | VNodeUpdateHook[]	-
provide?	static	ComponentProvideOptions	-
ref?	static	VNodeRef	-
ref_for?	static	boolean	-
ref_key?	static	string	-
render?	static	Function	-
renderTracked?	static	DebuggerHook	-
renderTriggered?	static	DebuggerHook	-
setup?	static	(this: void, props: LooseRequired<Props & Prettify<UnwrapMixinsType<IntersectionMixin<Mixin> & IntersectionMixin<Extends>, "P">>>, ctx: { attrs: Data; emit: (event: "update:modelValue", ...args: [string | null]) => void & (event: "update:model-value", ...args: [string | null]) => void & (event: "invalid-file-type", ...args: [string, string[]]) => void & (event: "click:clear", ...args: [MouseEvent]) => void & (event: "click:appendInner", ...args: [MouseEvent]) => void & (event: "click:prependInner", ...args: [MouseEvent]) => void & (event: "click:control", ...args: [MouseEvent]) => void & (event: "mousedown:control", ...args: [MouseEvent]) => void & (event: "update:focused", ...args: [boolean]) => void; expose: <Exposed>(exposed?: Exposed) => void; slots: UnwrapSlotsType<S>; }) => | void | RenderFunction | { } | Promise<{ }>	-
slots?	static	SlotsType<InlineImageFieldSlots>	-
style?	static	unknown	-
template?	static	string | object	-
watch?	static	ComponentWatchOptions	-

Methods

$watch()

$watch<T>(
   source: T,
   cb: T extends (...args: any) => R ? (...args: [R, R, OnCleanup]) => any : (...args: [any, any, OnCleanup]) => any,
   options?: WatchOptions<boolean>): WatchStopHandle;

Type Parameters

Type Parameter
T extends string | (...args: any) => any

Parameters

Parameter	Type
source	T
cb	T extends (...args: any) => R ? (...args: [R, R, OnCleanup]) => any : (...args: [any, any, OnCleanup]) => any
options?	WatchOptions<boolean>

Returns

WatchStopHandle

---

activated()?

static optional activated(): any;

Returns

any

---

beforeCreate()?

static optional beforeCreate(): any;

Returns

any

---

beforeDestroy()?

static optional beforeDestroy(): any;

Returns

any

Deprecated

use beforeUnmount instead

---

beforeMount()?

static optional beforeMount(): any;

Returns

any

---

beforeUnmount()?

static optional beforeUnmount(): any;

Returns

any

---

beforeUpdate()?

static optional beforeUpdate(): any;

Returns

any

---

created()?

static optional created(): any;

Returns

any

---

deactivated()?

static optional deactivated(): any;

Returns

any

---

destroyed()?

static optional destroyed(): any;

Returns

any

Deprecated

use unmounted instead

---

mounted()?

static optional mounted(): any;

Returns

any

---

serverPrefetch()?

static optional serverPrefetch(): void | Promise<any>;

Returns

void | Promise<any>

---

unmounted()?

static optional unmounted(): any;

Returns

any

---

updated()?

static optional updated(): any;

Returns

any