©2020-2024 ioDraw All rights reserved
对日期进行了预处理（将起始的默认时间设置为当前时间，结束时间的默认时间设置为往一个月后），即使是点击了时间也不会报错
运行图效果
vue文件
<template> <div> <label>本月月初时间</label> <el-date-picker v-model="startTime" type
="datetime" :editable="false" format="yyyy-MM-dd HH:mm:ss" style="width: 200px"
value-format="yyyy-MM-dd HH:mm:ss" ></el-date-picker> <label>当前时间</label> <!--
如果我们给其中的一个日期设置了默认值，那么就尽量不要再去给他使用value-
format了，不然就会报错，因为他是string类型，我们可以在发起请求的时候将数据转化为后端想要的数据传过去，例子如下--> <el-date-
picker v-model="endTime" type="datetime" :editable="false" format="yyyy-MM-dd
HH:mm:ss" style="width: 200px" value-format="yyyy-MM-dd HH:mm:ss" ></el-date-
picker> <!-- 获取当前时间的一个月后的时间值 --> <label>一个月后时间</label> <el-date-picker v-model=
"nextTime" type="datetime" :editable="false" format="yyyy-MM-dd HH:mm:ss" style=
"width: 200px" value-format="yyyy-MM-dd HH:mm:ss" ></el-date-picker> <el-button
@click="find">查询</el-button> </div> </template> <script> export default { data()
{ return { startTime: "", endTime: "", nextTime: "", } }, methods: {
getStartTime() { // 获取其当前月的第一天 var data = new Date() var Da = new Date(data.
getTime()) var y = Da.getFullYear() var m = Da.getMonth() + 1 m = m < 10 ? "0" +
m: m return y + "-" + m + "-" + "01" + " " + "00" + ":" + "00" + ":" + "00" },
getEndTime() { var data = new Date() var Da = new Date(data.getTime()) var y =
Da.getFullYear() var m = Da.getMonth() + 1 var d = Da.getDate() var H = Da.
getHours() var mm = Da.getMinutes() var ss = Da.getSeconds() m = m < 10 ? "0" +
m: m d = d < 10 ? "0" + d : d H = H < 10 ? "0" + H : H return y + "-" + m + "-"
+ d + " " + H + ":" + mm + ":" + ss }, getnextTime() { var data = new Date() var
Da= new Date(data.getTime() + 24 * 60 * 60 * 1000 * 30) var y = Da.getFullYear(
) var m = Da.getMonth() + 1 var d = Da.getDate() var H = Da.getHours() var mm =
Da.getMinutes() var ss = Da.getSeconds() m = m < 10 ? "0" + m : m d = d < 10 ?
"0" + d : d H = H < 10 ? "0" + H : H return y + "-" + m + "-" + d + " " + H +
":" + mm + ":" + ss }, find() { console.log(this.startTime, this.endTime, this.
nextTime) }, }, mounted() { var vm = this vm.startTime = vm.getStartTime() vm.
endTime= vm.getEndTime() vm.nextTime = vm.getnextTime() }, } </script>