vue2+ElementUI时间选择器限制可选范围为今天往前7天内的任意一天
在Vue2中使用ElementUI时间选择器组件(el-date-picker
),要限制可选的日期范围为今天往前的7天,可以通过设置picker-options
属性来实现。以下是一个示例代码:
<template>
<el-date-picker
v-model="date"
type="date"
placeholder="选择日期"
:picker-options="pickerOptions">
</el-date-picker>
</template>
<script>
export default {
data() {
return {
date: '',
pickerOptions: {
disabledDate(time) {
// 可选范围为今天往前推7天,不可选今天之后的日期
return time.getTime() > Date.now() || time.getTime() < Date.now() - 7 * 24 * 3600 * 1000;
}
}
};
}
};
</script>
在这个例子中,disabledDate
函数用来设置不可选择的日期。time.getTime()
获取的是某个日期的时间戳,Date.now()
获取的是当前时间的时间戳。通过对比,我们可以设置出只能选择今天往前7天内的日期。
评论已关闭