Блог

Главная - Вопросы по программированию - как я могу замаскировать ввод даты в vuetify, компонент v-date-picker

как я могу замаскировать ввод даты в vuetify, компонент v-date-picker

#javascript #vue.js #vuetify.js

#javascript #vue.js #vuetify.js

Вопрос:

Я пытаюсь добавить ввод, позволяющий пользователям вводить дату в формате dd / mm / YYYY.

MyPage.vue

 <v-date-picker
  class="custom-input"
  hide-details
  v-model="date"
  ref="paDate"
  readonly
  hideDetails/>
  
 export default {
  data() {
    return {
      date: new Date()

Я попробовал v-mask и vue-the-mask, но оба показывают 01012020

Также я хотел бы знать, возможно ли проверить, является ли введенная дата действительной датой (день 1-31 / месяц 1-12)

Любая помощь будет оценена!

Ответ №1:

Вы можете использовать moment.js за это. Примером может быть:

 import moment from 'moment'

  data() {
   return {
    date: moment().format("DD/MM/YYYY")
   }
  }

Подробнее о параметрах форматирования здесь
Также дата может быть проверена с помощью moment.js

Комментарии:

1. спасибо за ваш ответ, но из предоставленной вами документации: » В большинстве случаев вы не должны выбирать Момент для новых проектов. » Кроме того, он конфликтует с пакетом DatePicker , с теми же результатами, что и v-mask и vue-the-mask

2. Для этого вы можете попробовать другую библиотеку. Проверьте документ Vuetify vuetifyjs.com/en/components/date-pickers /…

3. dayjs маленький и очень похож на moment. dayjs.format("DD/MM/YYYY")