vue+elementui 只能选7天内的日期
程序员文章站
2024-03-11 16:31:55
...
html:
<el-col :span="2">查询时间</el-col>
<el-col :span="6">
<el-date-picker
v-model="checkParams.startDate"
type="date"
placeholder="开始时间"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
style="width:45%"
:picker-options="pickerStart"
/>
<span style="padding: 0 1%;">至</span>
<el-date-picker
v-model="checkParams.endDate"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
type="date"
placeholder="结束时间"
style="width:45%"
:picker-options="pickerEnd"
/>
</el-col>
js:
data() {
const _this = this;
const dateScope = 7 * 24 * 3600 * 1000;
return {
pickerStart: {
disabledDate(time) {
if (_this.checkParams.endDate != "") {
/**
* 如果另一个框有值,就只能选7天内的日期
*
*/
let date = new Date(_this.checkParams.endDate).getTime();
return (
time.getTime() < date - dateScope ||
time.getTime() > dateScope + date
);
}
return time.getTime() > Date.now();
}
},
pickerEnd: {
disabledDate(time) {
if (_this.checkParams.startDate != "") {
let date = new Date(_this.checkParams.startDate).getTime();
return (
time.getTime() < date - dateScope ||
time.getTime() > dateScope + date
);
return;
}
return time.getTime() > Date.now();
}
},}