使用 semantic-ui-calender设置 minDate 和 maxDate

Question

有人已经使用语义UI日历了吗？我卡住了，如何将最小和最大时间设置为 11：00 PM - 6：00 AM。

let today = new Date();
let set_date = new Date(today.getFullYear(), today.getMonth(), today.getDate());
let set_next_date = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1);

let min = new Date(set_date.setHours(23,0,0,0));
let max = new Date(set_next_date.setHours(6,0,0,0));
startTime.calendar({
    type: 'time',
    minDate: min,
    maxDate: max,
    onChange(date, text, mode){
        self.updateStartTime(text)
    },
})
endTime.calendar({
    type: 'time',
    minDate: min,
    maxDate: max,
    startCalendar: startTime,
    onChange(date, text, mode){
        self.updateEndTime(text)
    }
})

Answer 1

你不需要像你所做的那样创建date实例来为它们设置hours，只要像我一样做，你就会得到你想要的。

定义 2 个新变量并使用setHours方法更改其工作时间：

var minDate = new Date();
var maxDate = new Date();
minDate.setHours(6);
maxDate.setHours(23);

并初始化您的Semantic-UI Calendar如下所示：

startTime.calendar({
    type: 'time',
    minDate: minDate,
    maxDate: maxDate,
    onChange(date, text, mode){
        self.updateStartTime(text)
    },
})
endTime.calendar({
    type: 'time',
    minDate: minDate,
    maxDate: maxDate,
    startCalendar: startTime,
    onChange(date, text, mode){
        self.updateEndTime(text)
    }
})

我还在JSFiddle上为您提供了一个示例：http://jsfiddle.net/ali_bahrami/ka52oo7s/1/