DateTimeComponent

This component allows you to create a datetime component. It depends on ValidationObserver, extend and required from Vee Validate.

Example

DateTimeComponent

<date-time-component
    label="Label",
    placeholder="Placeholder",
    :min-date-time="new Date()",
    :show-clear-button="true",
    :show-now-button="true",
    :append-to-body="true",
    position="is-top-right"
/>

Props

NameDescriptionTypeRequiredDefault
valueInner value of the componentfalsenull
horizontalAllows you to indicate if the component will be horizontal or notBooleanfalsetrue
focusableSame as focusable in Buefy b-datetimepickerBooleanfalsetrue
formatAllows you to indicate the format of the returned dateStringfalse"DD/MM/YYYY HH:mm"
showClearButtonAllows you to indicate if the today button will be displayed or notBooleanfalsefalse
showNowButtonAllows you to indicate if the now button will be displayed or notBooleanfalsefalse
minDateTimeAllows you to indicate the selectable min datetimeDatefalse-
maxDateTimeAllows you to indicate the selectable max datetimeDatefalse-
editableAllows you to indicate if the date is editableBooleanfalsetrue
isRequiredAllows you to indicate if the date is requiredBooleanfalsefalse
labelInsideAllows you to indicate if the label will be inside of the inputBooleanfalsefalse
labelOnBorderAllows you to indicate if the label will be on the border of the inputBooleanfalsefalse
mobileNativeSame as mobile-native in Buefy b-datetimepickerBooleanfalsefalse
typeSame as type in Buefy b-datetimepickerStringfalseundefined
rangeSame as range in Buefy b-datetimepickerBooleanfalsefalse
appendToBodySame as append-to-body in Buefy b-datetimepickerBooleanfalsefalse
positionSame as position in Buefy b-datetimepickerStringfalseundefined
mobileModalSame as mobile-modal in Buefy b-datetimepickerBooleanfalsetrue
sizeSame as size in Buefy b-datetimepickerStringfalseundefined
inlineSame as inline in Buefy b-datetimepickerBooleanfalsefalse
loadingSame as loading in Buefy b-datetimepickerBooleanfalsefalse
datepickerSame as datepicker in Buefy b-datetimepickerObjectfalseundefined
timepickerSame as timepicker in Buefy b-datetimepickerObjectfalseundefined
validationModeValidation mode to ValidationProviderStringfalse"aggressive"
hideValidationAllows you to indicate if show validation or notBooleanfalsefalse
activeTabAllows you to indicate what is the active tabStringfalse""
localeLocale string {en, es ...} for display language on componentStringfalse"en"

Events

Event NameDescriptionParameters
input--