vue中在时间输入框中默认显示时间

<template>
<card>
<label>开始时间</label>
<DatePicker
v-model="startTime"
type="datetime"
:editable="false"
format="yyyy-MM-dd HH:mm"
style="width: 200px"
></DatePicker>
<label>过期时间</label>
<DatePicker
v-model="endTime"
type="datetime"
:editable="false"
format="yyyy-MM-dd HH:mm"
style="width: 200px"
></DatePicker>
</card>
</template>

<script>
export default {
data() {
return {
startTime:"",
endTime:""
}
},
methods: {
// 格式化时间,获取当前时间的一个月后的时间值
convertToLateDate() {
var data = new Date();
var Da = new Date(data.getTime() + 24 * 60 * 60 * 1000 * 30);
// 以上两行代码为关键代码,若想要返回一天后的时间,则可以将第二行代码更换为下面代码
// var Da = new Date(data.getTime() + 24 * 60 * 60 * 1000);
// 若是想要返回值为当前时间,则上面两行代码可以直接修改为下面代码即可。
// var Da = new Date()
var y = Da.getFullYear();
var m = Da.getMonth() + 1;
var d = Da.getDate();
var H = Da.getHours();
var mm = Da.getMinutes();
m = m < 10 ? "0" + m : m;
d = d < 10 ? "0" + d : d;
H = H < 10 ? "0" + H : H;
return y + "-" + m + "-" + d + " " + H + ":" + mm;
}
},
// 页面加载完毕后触发的事件
mounted() {
var vm = this;
vm.startTime = new Date();// 默认显示为当天时间
vm.endTime = vm.convertToLateDate();
}
}
</script>

 

posted @ 2019-11-20 15:34  这都没什么  阅读(3990)  评论(0编辑  收藏  举报