Vuetify Daterange Picker is missing the VueJS date range picker you were looking for.

vuetify date range picker example, vuetify 3 datepicker, v date picker on change

Features:

• Preset Selection
• Automatically highlight preset based on the chosen date.
• Custom format
• Material Design (Obviously!)
• Light & Dark Themes
• Custom Prev & Next buttons

How to make use of it:

Installation:

yarn add vuetify-daterange-picker@3
# OR
npm install --save vuetify-daterange-picker@3

1. This lets you use the component everywhere in your app.

// main.js
import VuetifyDaterangePicker from "vuetify-daterange-picker";
import "vuetify-daterange-picker/dist/vuetify-daterange-picker.css";
Vue.use(VuetifyDaterangePicker);

2. Import in Components

<script>
import { VDaterange } from "vuetify-daterange-picker"
import "vuetify-daterange-picker/dist/vuetify-daterange-picker.css";
export default {
  components: { VDaterange },
}
</script>

3. Usage

<!-- Assuming you have installed as plugin -->
<!-- If you wanna use it in components, 
     please import necessary files as shown above -->
<template>
  <v-daterange v-model="range"></v-daterange>
</template>
<script>
export default {
  components: { VDaterange },
  data() {
    return {
      range: {}
    }
  }
}
</script>

vuetify date range picker plugin/github/gitbook

See Demo And Download

Official Website(praveenpuglia): Click Here

This superior jQuery/javascript plugin is developed by praveenpuglia. For extra advanced usage, please go to the official website.