1.template中使用:
<el-form-item><date-range-pickerv-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);},
element UI 时间选择器 显示默认时间为当前时间至7天之前时间 (并格式化日期-年月日 时分秒)