如何在 Vue-timepicker 中設置時間限制？

Question

我在我的項目中是 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>

Answer 1

請將vue2-timepicker升級到 最新版本。 自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']"的快捷方式:hour-range="['9a', '10a', '11a', '12p', '1p', '2p', '3p', '4p', '5p']" 。

您可以查看演示頁面和文檔以獲取更多詳細信息。