Vuetify,时间选择器-如何以15分钟为间隔设置允许的时间?

问题描述

我是vuetify的新手。我试图以15分钟为间隔设置时间,并将另一个选项设置为“禁用”。有人可以帮助我找到解决方案吗? 代码在这里

   v-model="time"
   :allowed-hours="allowedHours"
   :allowed-minutes="allowedMinutes"
   class="mt-4"
   format="24hr"
   scrollable
   min="9:30"
   max="22:15"
 ></v-time-picker>
 <v-time-picker
   v-model="timestep"
   :allowed-minutes="allowedStep"
   class="mt-4"
   format="24hr"
 ></v-time-picker>


script>
export default {
 data () {
   return {
     time: '11:15',timestep: '10:10',}
 },methods: {
allowedHours,allowedMinutes:,allowedStep:,},}
</script>

解决方法

您可以尝试

<v-time-picker
   v-model="time"
   :allowed-minutes="allowedStep"
   format="24hr"
   scrollable
   min="9:30"
   max="22:15"
></v-time-picker>

然后您可以添加allowedStep方法,如下所示:

methods: {
  allowedStep: m => m % 15 === 0,},