Vue中获取当前时间,可用于判断信息是否已过有效时间
<template>
<div class="content-wrapper">
<section>
<el-table border stripe :data="datas" highlight-current-row
@current-change="handleCurrentChange"
width="100%" tooltip-effect="light" v-loading="requested">
<el-table-column label="截止时间" :show-overflow-tooltip="true" prop="endTime"
header-align="center" align="center">
</el-table-column>
<el-table-column label="状态" header-align="center" align="center">
<template slot-scope="scope">
<el-tag type="info" v-if="currentTime > scope.row.endTime">失效</el-tag>
<el-tag type="success" v-if="currentTime < scope.row.endTime">未失效</el-tag>
</template>
</el-table-column>
</el-table>
</section>
</div>
</template>
<style>
</style>
<script>
export default {
data() {
return {
queryForm: {
title: '',
page: 1,
size: 10
},
datas: [],
requested: false,
currentTime: '',
}
},
mounted() {
this.query(this.queryForm.page, this.queryForm.size);
},
methods: {
query() {
this.requested = true;
this.http.get('/admin/messageInfo', this.queryForm).then(resp => {
this.currentTime = this.format(new Date(), "yyyy-MM-dd HH:mm:ss");
this.currentRow = null;
this.datas = resp.data.content;
}).finally(() => {
this.requested = false;
});
},
format(date, fmt) {
let o = {
"M+": date.getMonth() + 1, //月份
"d+": date.getDate(), //日
"H+": date.getHours(), //小时
"m+": date.getMinutes(), //分
"s+": date.getSeconds(), //秒
"q+": Math.floor((date.getMonth() + 3) / 3), //季度
"S": date.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
for (let k in o)
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
},
}
}
</script>
需要注意的一点是:HH才是24小时制,hh是12小时制
因此如果用value-format时间组件,组件只会保留日期的选择,会失去时间的选择