https://blog.csdn.net/weixin_45895806/article/details/116175810
需求:可選擇的時間大于當前時間,不符合條件的全部禁用
以下實現(xiàn)方式可精確到年违诗、月漱凝、日、時诸迟、分茸炒、秒
HTML
<el-form-item label="盤點開始時間" prop="checkStartTime">
<el-date-picker
type="datetime"
placeholder="請選擇開始時間"
style="width: 100%"
clearable
format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions"
v-model="inventoryEdit.checkStartTime"
></el-date-picker>
</el-form-item>
data里
// 選擇開始時間大于等于當前時間
pickerOptions: {
disabledDate(time) {
const dateTime = new Date();
const startDateTime = dateTime.setDate(dateTime.getDate() - 1);
const endDateTime = dateTime.setDate(dateTime.getDate() + 30000); //30000為當前日期之后多少天
return (
time.getTime() < new Date(startDateTime).getTime() ||
time.getTime() > new Date(endDateTime).getTime()
);
},
selectableRange:
//setMinutes,getMinutes限制分 , 年、月阵苇、日壁公、時、分绅项、秒同理,+1為數(shù)字區(qū)間
//重點就在這個set get, 漁給了, 魚自己捕吧
this.parseTime(new Date().setMinutes(new Date().getMinutes() + 1),"{hh}:{ii}:{ss}") + "- 23:59:00",
},
//this.parseTime為封裝的方法在下面貼出來了
this.parseTime
// 日期格式化
export function parseTime(time, pattern) {
if (arguments.length === 0 || !time) {
return null
}
const format = pattern || '{y}-{m}-zdljjrn {h}:{i}:{s}'
let date
if (typeof time === 'object') {
date = time
} else {
if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
time = parseInt(time)
} else if (typeof time === 'string') {
time = time.replace(new RegExp(/-/gm), '/');
}
if ((typeof time === 'number') && (time.toString().length === 10)) {
time = time * 1000
}
date = new Date(time)
}
const formatObj = {
y: date.getFullYear(),
m: date.getMonth() + 1,
d: date.getDate(),
h: date.getHours(),
i: date.getMinutes(),
s: date.getSeconds(),
a: date.getDay()
}
const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
let value = formatObj[key]
// Note: getDay() returns 0 on Sunday
if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
if (result.length > 0 && value < 10) {
value = '0' + value
}
return value || 0
})
return time_str
}