Как отключить выбор минут в виджете v-time-picker?

Как отключить выбор минут в виджете v-time-picker?

06.01.2020 08:26:42 Просмотров 27 Источник

В моем Vue.приложение js, я использую виджет v-time-picker фреймворка Vuetify. Я хочу отключить выбор минут. Если пользователь выбирает час, автоматически вставляется 00 в минутах. Как сделать это правильно? Прямо сейчас я устанавливаю allowed-minutes, но в этом случае пользователю все равно нужно выбрать минуты.

<template>
  <v-time-picker
    full-width
    scrollable
    format="24hr"
    :disabled="timePickerDisabled"
    :allowed-minutes="allowedMinutes"
    v-model="selectedTimePickerItems">
  </v-time-picker>
</template>

<script>
export default {
  data () {
    return {
      selectedTimePickerItems: null,
      timePickerDisabled: true
    }
  },
  methods: {
    allowedMinutes: m => m % 60 === 0
  }
}
</script>
У вопроса есть решение - Посмотреть?

Ответы - Как отключить выбор минут в виджете v-time-picker? / How disable to select minutes in v-time-picker widget?

Anees Hameed

06.01.2020 11:28:02

Есть событие click на час @нажмите:час. Событие выдает текущее значение timepicker. Вы можете использовать это для установки данных.

Сайт CodePen: https://codepen.io/aaha/pen/abzEWPE

 <div id="app">
  <v-app>
       <v-menu
        v-model="menu"
        max-width="290px"
        min-width="290px"
      >
        <template v-slot:activator="{ on }">
          <v-text-field
            :value="time"
            label="Picker in menu"
            readonly
            v-on="on"
          ></v-text-field>
        </template>
        <v-time-picker
          v-if="menu"
          :value="time"
          @click:hour="closePicker"
        ></v-time-picker>
      </v-menu>
  </v-app>
</div>

var vApp = new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data: {
    time: null,
    menu: false
  },
  methods: {
    closePicker: function(v){
      v = v < 10 ? '0'+v : v;
      this.time = v+":00";
      this.menu = false
    }
  }
})
https://stackoverflow.com/questions/59607056/how-disable-to-select-minutes-in-v-time-picker-widget/59608845#comment105384276_59608845
Спасибо вам за ваш ответ! closePickerминут, как я хочу, но в моем случае у меня есть только 00. У меня нет v-time-picker, как в вашем примере. После выбора часа виджет делает анимацию для минутного блока. Я хочу отключить эту анимацию и не показывать блок минут. Возможно ли это по вашему мнению?
Закрыть X