Flatpickr

flatpickr is a lightweight and powerful datetime picker. Use the required class varient (e.g. range_flatpicker, date_flatpicker, wrap_flatpicker active ) for different flatpickr. For more details

Installation
npm i vue-flatpickr-component
Script
<flat-picker v-model="form.dateTime" :config="configs.dateTimePicker" class="form-control" placeholder="Select Date time.."></flat-picker>
                
import { ref, reactive } from 'vue'
import FlatPicker from 'vue-flatpickr-component'

const form = ref({
  dateTime: null,
})

const configs = reactive({
  dateTimePicker: {
    enableTime: true,
    dateFormat: 'd-m-Y H:i'
  },
 })
Previous Next