您的位置：首页 > Web前端 > Vue.js

vue获取时间戳转换为日期格式代码实例

2019-05-29 07:01 5176 查看

vue获取时间戳转换为日期格式。

方法一为转载黄轶老师的format方法：出处（黄轶老师github https://github.com/ustbhuangyi）；

// date.js
export function formatDate (date, fmt) {
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
}
let o = {
'M+': date.getMonth() + 1,
'd+': date.getDate(),
'h+': date.getHours(),
'm+': date.getMinutes(),
's+': date.getSeconds()
};
for (let k in o) {
if (new RegExp(`(${k})`).test(fmt)) {
let str = o[k] + '';
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str));
}
}
return fmt;
};

function padLeftZero (str) {
return ('00' + str).substr(str.length);
};

<!-- **.vue -->
<template>
<!-- time时间戳 -->
<div>{{time | formatDate}}</div>
<!-- 输出结果 -->
<!-- <div>2016-07-23 21:52</div> -->
</template>
<script>
import {formatDate} from './common/date.js';
export default {
filters: {
formatDate(time) {
var date = new Date(time);
return formatDate(date, 'yyyy-MM-dd hh:mm');
}
}
}
</script>

方法二为自写（在百度出的结果十个有九个是上述方法且在不想使用上述方法的情况下）：

使用vue.filter

<!-- demo.vue -->
<template>
<!-- time为时间戳 -->
<div>{{time | formatDate}}</div>
<!-- 结果为 2018-01-23 18:31:35 -->
</template>
<script type="text/ecmascript-6">
export default {
data() {
return {
time: 1516703495241
};
},
filters: {
formatDate: function (value) {
let date = new Date(value);
let y = date.getFullYear();
let MM = date.getMonth() + 1;
MM = MM < 10 ? ('0' + MM) : MM;
let d = date.getDate();
d = d < 10 ? ('0' + d) : d;
let h = date.getHours();
h = h < 10 ? ('0' + h) : h;
let m = date.getMinutes();
m = m < 10 ? ('0' + m) : m;
let s = date.getSeconds();
s = s < 10 ? ('0' + s) : s;
return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
}
}
};
</script>
<style lang="stylus" rel="stylesheet/stylus">

</style>

以上所述是小编给大家介绍的vue获取时间戳转换为日期格式详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！

您可能感兴趣的文章:

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航