Sunday, June 2, 2024
 Popular · Latest · Hot · Upcoming
68
rated 0 times [  73] [ 5]  / answers: 1 / hits: 5699  / 5 Years ago, tue, august 20, 2019, 12:00:00

I try to change format of days in Date/month picker component. At the moment list of days as M,T,W,T,F,S,S, but I need Mo,Tu,We,Th,Fr,Sa,Su. In API I can see that necessary parameter called day-format and its value is null (default).
Can anybody please explain: is it possible to change this format of days?



Here is the API of Vuetify:
https://vuetifyjs.com/en/components/date-pickers#date-month-pickers


More From » vue.js

 Answers
10

  • Use the weekday-format to pass the date to a function;

  • Convert the date to day of the week (0..6)

  • Use that as the index for an array of strings ('Mo'..'Su')



code:



<div id=app>
<v-app id=inspire>
<v-row justify=center>
<v-date-picker :weekday-format=getDay v-model=picker></v-date-picker>
</v-row>
</v-app>
</div>


const daysOfWeek = ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'];

new Vue({
el: '#app',
vuetify: new Vuetify(),
data () {
return {
picker: new Date().toISOString().substr(0, 10),
}
},
methods:{
getDay(date){
let i = new Date(date).getDay(date)
return daysOfWeek[i]
}
}
})

[#6515] Sunday, August 18, 2019, 5 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
minab

Total Points: 701
Total Questions: 104
Total Answers: 91

Location: Saint Pierre and Miquelon
Member since Fri, Jan 28, 2022
2 Years ago
minab questions
;