'vuetify date-picker set default month
I'm using the Date Picker element with a v-model being an array of dates: ['2022-04-10', '2022-04-11'] .
Even though my dates are in April 2022, I would like to set the default month to May (I would like the Date Picker to display May 2022 by default).
I tried with to play with min="2022-05-01" and max="2022-05-31" but still it displays April 2022 by default.
How can I display May even though my model doesn't have any date in May?
<v-date-picker
min="2022-05-01"
max="2022-05-31"
v-model="datesTest"
:show-adjacent-months="false"
:show-current="false"
color="red"
multiple
no-title
></v-date-picker>
Solution 1:[1]
datesTest should contain the date of May month. Hence, It will be like :
data: () => ({
datesTest: '2022-05-01',
})
Working Demo :
new Vue({
el: '#app',
vuetify: new Vuetify(),
data: () => ({
datesTest: '2022-05-01',
})
})
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<script src="https://unpkg.com/[email protected]/dist/vuetify.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/vuetify.min.css"/>
<div id="app">
<v-app id="inspire">
<v-row justify="center">
<v-date-picker
min="2022-05-01"
max="2022-05-31"
v-model="datesTest"
:show-adjacent-months="false"
:show-current="false"
color="red"
multiple
no-title
></v-date-picker>
</v-row>
</v-app>
</div>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Rohìt JÃndal |
