element ui 选择时间组件: 需求:实现默认时间定位于当前时间延后7天的日期;且当前时间之前的日期不能选;
html部分:
<el-date-picker
v-model="shopForm.end_time"
type="datetime"
size="medium"
style="width:100%"
placeholder="选择日期时间"
:picker-options="expireTimeOption"
value-format="timestamp"
default-time="00:00:00"
/>
js 部分代码实现:
data() {
return {
shopForm: {
end_time: ''
},
expireTimeOption: {
disabledDate(date) {
return date.getTime() <= Date.now() - 8.64e7 // new Date()
}
}
}
},
created() {
this.setTime() // 设置默认时间
},
methods: {
// 默认时间设置 7天后
setTime() {
const nowD = new Date()
nowD.setTime(nowD.getTime() + 7 * 3600 * 1000 * 24)
this.shopForm.end_time = nowD
},
/**
* 选择时间
*/
changeendTime() {
if (this.shopForm.end_time > (Date.now())) {
this.shopForm.end_time = this.shopForm.end_time
} else {
this.shopForm.end_time = ''
this.$message.error('请选择大于当前日期')
}
},
}