Vuetify plugin VDatetimeField

Vuetify datetime picker with input fields 📅

Features

VDatetimeField

• Input - You can input date and time via keyboard
• Use separately - You can use only datepicker or only timepicker
• Masked - Time and date input masked

Requirements

• Vuetify 2.x
• Vue 2.x

Installation

Install package

npm install --save v-datetime-field

or

yarn add v-datetime-field

Local

component.vue

<script>
import { VDatetimeField } from 'v-datetime-field'

export default {
  components: { VDatetimeField },
}
</script>

Global

main.js

import Vue from 'vue'
import VDatetimeField from 'v-datetime-field'

Vue.use(VDatetimeField)

main.js

<v-datetime-field
  v-model="formData['date']"
  :menu-props="{ top: true }"
  :date-props="{ outlined: true, label: 'Date' }"
  :error-messages="errors"
/>

Props

| Name | Type | Default | Required | Description | | -------------- | ---------- | -------------- | -------- | ----------------------------- | | date-props | object | {} | -- | Properties for date text input| | time-props | object | {} | -- | Properties for time text input| | menu-props | object | {} | -- | Properties for v-menu | | only-date | boolean | False | -- | Use only datepicker | | only-time | boolean | False | -- | Use only timepicker |

Roadmap

1. Add i18n

Welcome to contribute!

License

MIT © Komarov Roman