1.template中使用:
<el-form-item>
<date-range-picker
v-model="deviceFormData.time"
class="date-item"
:start-placeholder="$t('NeoLight.startTime')"
:end-placeholder="$t('NeoLight.endTime')"
value-format="yyyy-MM-dd"
:picker-options="pickerOptions"
/>
</el-form-item>
2.data中定义:
data() {
return {
deviceFormData: {
time: [],
},
//不能选择当前日期之后的时间
pickerOptions: {
disabledDate(time) {
return time.getTime() > Date.now();
}
},
}
};
},
3.methods方法:
created() {
this.getTimeFn();
},
// 设置默认时间
getTimeFn() {
const that = this;
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
this.deviceFormData.time[0] = that.formatDate(start);
this.deviceFormData.time[1] = that.formatDate(end);
},
// 格式化时间
formatDate(date) {
var myyear = date.getFullYear();
var mymonth = date.getMonth() + 1;
var myweekday = date.getDate();
if (mymonth < 10) {
mymonth = "0" + mymonth;
}
if (myweekday < 10) {
myweekday = "0" + myweekday;
}
return myyear + "-" + mymonth + "-" + myweekday;
},
4.实现效果:
小tips 时 分 秒 格式化时间
/**
* 格式化时间 到 时 分 秒
*/
formatDate(date) {
var myyear = date.getFullYear();
var mymonth = date.getMonth() + 1;
var myweekday = date.getDate();
var h = date.getHours();
if (mymonth < 10) {
mymonth = "0" + mymonth;
}
if (myweekday < 10) {
myweekday = "0" + myweekday;
}
h = h < 10 ? "0" + h : h;
var m = date.getMinutes();
m = m < 10 ? "0" + m : m;
var s = date.getSeconds();
s = s < 10 ? "0" + s : s;
return (
myyear + "-" + mymonth + "-" + myweekday + " " + h + ":" + m + ":" + s
);
},