<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="app">
{{date | formatDate}}
</div>
<script src="./vue.js"></script>
<script>
const
s = 1000,
m = 60 * s,
h = 60 * m,
d = 24 * h,
mo = 30 * d,
y = 365 * d
const fdate = [
{
time: y,
text: '年'
}, {
time: mo,
text: '月'
}, {
time: d,
text: '天'
}, {
time: h,
text: '小时'
}, {
time: m,
text: "分钟"
}, {
time: s,
text: '秒'
}
]
const app = new Vue({
el: '#app',
data: {
date: '2019-7-29-6:30',
},
filters: {
formatDate (value) {
// s m h d mo y
// 计算出时间差
const time = Date.now() - new Date(value)
for (let i = 0; i < fdate.length; i++) {
const t = time / fdate[i].time
if (t >= 1) {
return Math.floor(t) + fdate[i].text + '前'
}
}
}
}
})
</script>
</body>
</html>
vue_过滤格式化日期&显示几天前、几小时前···
最新推荐文章于 2023-09-15 13:15:00 发布