DatepickerWrapper โ
A Vue.js wrapper for flatpickr.
Serves as a wrapper for flatpickr library. Used by DateElement
and DatesElement
components. You can reach its component instance, properties and methods via DateElement
or DatesElements
's input
property.
Options โ
Find below the list of options that can use to configure DatepickerWrapper
component. Options can be passed to the component via props.
value โ
- Type:
any
- Required:
true
<DatepickerWrapper :value="value" ... />
The value that you would regularly pass to v-model
.
options โ
- Type:
object
- Required:
true
<DatepickerWrapper :options="{ ... }" ... />
Additional options for flatpickr. It can be used if the flatpickr has any properties that Vueform has not implemented yet.
id โ
- Type:
number|string
- Required:
true
<DatepickerWrapperElement id="datepicker-id" ... />
Sets the id
attribute of datepicker input.
attrs โ
- Type:
object
- Default:
{}
<DatepickerWrapperElement :attrs="{ autofocus: true }" ... />
Assigns HTML attributes to the container / input field.
placeholder โ
- Type:
number|string
<DatepickerWrapper placeholder="Placeholder" ... />
Sets the placeholder
attribute of the datepicker input.
Properties โ
All the data
, computed
and inject
properties of the component.
datepicker$ โ
- Type:
object
- Default:
null
- Group:
data
The flatpickr instance.
config โ
- Type:
object
- Group:
computed
The flatpickr configuration object. Can be extended via options
with flatpickr options.
mode โ
- Type:
string
- Group:
computed
The current options.mode
.
input โ
- Type:
HTMLElement
- Group:
data
The date input DOM element.
Size โ
- Type:
string
- Group:
inject
The size of the component.
View โ
- Type:
string
- Group:
computed
The name of the resolved view for the component. This one should be used to determine the component's view in class functions.
template โ
- Type:
object
- Group:
computed
The component's template.
classes โ
- Type:
object
- Group:
computed
The component's classes.
theme โ
- Type:
object
- Group:
inject
The global theme object, which contains all the default templates and classes.
form$ โ
- Type:
Vueform
- Group:
inject
The root form's component.
el$ โ
- Type:
VueformElement
- Group:
inject
The parent element's component.
Events โ
Events emitted by the component.
change โ
- Params:
{string} newValue
- the new value{string} oldValue
- the old value{component} el$
- the element's component
Triggered when the element's value is changed.