如何在Vue-timepicker中设置时间限制?

时间:2019-03-27 17:36:53

标签: vuejs2 vuejs-datepicker

我在我的项目中是vue-timepicker,下面是组件的代码。我想将时间限制为太平洋标准时间上午9:00至下午5:00? 在vue-timepicker组件中该使用可能吗?如果是,请帮助我。

<vue-timepicker class="nopad full-width" format="hh:mm A" v-model="guest.time" v-validate="'required'" data-vv-name="time" :minute-interval="30"></vue-timepicker>

1 个答案:

答案 0 :(得分:2)

请从vue2-timepicker升级到latest version。自 v.0.2.0 起,我们添加了hour-range支持,可以完全满足您的需求。

根据您的情况,您可以将hour-range设置为:

<vue-timepicker class="nopad full-width"
    format="hh:mm A"
    :hour-range="[['9a', '5p']]"
    v-model="guest.time"
    v-validate="'required'"
    data-vv-name="time"
    :minute-interval="30"></vue-timepicker>

请注意,:hour-range="[['9a', '5p']]":hour-range="['9a', '10a', '11a', '12p', '1p', '2p', '3p', '4p', '5p']"的快捷方式。

您可以检查Demo pageDocumentation了解更多详细信息。