如何在时间选择器中设置时间限制？

Question

我是我的项目中的vue时间选择器，下面是组件的代码。我想把时间限制在晚上9点到下午5点？在vue时间选择器组件中可以使用吗？如果是，请帮我做。

<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>

Answer 1

请将vue2-timepicker升级到最新版本。我们在hour-range v.0.2.0之后添加了一个支持，它完全满足了您的需要。

在这种情况下，可以将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']"的快捷方式。

您可以查看演示页和文档以获得更多详细信息。