<template>里面的内容
<span class="shijian">
{
{
item.create_at | dateFilters}}
</span>
item.create_at是axios请求到的数据
dateFilters是调用时间过滤器的方法
<script>中的内容
filters: {
dateFilters: function(value) {
var year = 24 * 60 * 60 * 1000 * 365;
var month = 24 * 60 * 60 * 1000 * 30;
var day = 24 * 60 * 60 * 1000;
var hour = 60 * 60 * 1000;
var minute = 60 * 1000;
var newDate = new Date().getTime();
var time = new Date(value).getTime();
var date = newDate - time;
var years =
parseInt(date / year) > 0 ? `${
parseInt(date / year)}年前` : "";
var months =
parseInt(date / month) > 0 ? `${
parseInt(date / month)}月前` : "";
var days = parseInt(date / day) > 0 ? `${
parseInt(date / day)}天前` : "";
var hours =
parseInt(date / hour) > 0 ? `${
parseInt(date / hour)}小时前` : "";
var minutes =
parseInt(date / minute) > 0 ? `${
parseInt(date / minute)}分钟前` : "";
if (years.length != 0) {
return years;
} else if (months.length != 0) {
return months;
} else if (days.length != 0) {
return days;
} else if (hours.length != 0) {
return hours;
} else if (minutes.length != 0) {
return minutes;
} else {
return parseInt(date / 1000) > 0 ? `${
parseInt(date / 1000)}秒前` : "";
}
}
},
具体效果如图：
以上 这个是比较复杂的时间过滤器
简单易懂的在这里！！！
<template>里面的内容 跟上面是一样的
<span class="shijian">
{
{
item.time | timeFilter}}
</span>
item.create_at是axios请求到的数据
timeFilter是调用时间过滤器的方法
<script>中的内容
filters: {
timeFilter(ms) {
let data = new Date();
let now = data.getTime();
let time = (now - ms) / 1000 / 60;
let timeStr = "";
if (time <= 1) {
timeStr = "刚刚";
} else if (time <= 2) {
timeStr = "1分钟前";
} else if (time <= 3) {
timeStr = "2分钟前";
} else if (time <= 4) {
timeStr = "3分钟前";
} else if (time <= 5) {
timeStr = "4分钟前";
} else if (time <= 6) {
timeStr = "5分钟前";
} else {
let dat = new Date();
dat.setTime(ms);
// let y = dat.getFullYear(); //年
let m = dat.getMonth(); //月
let d = dat.getDate(); //日
let h = dat.getHours(); //时
let mm = dat.getMinutes(); //分
let s = dat.getSeconds(); //秒
timeStr = `${
m}月${
d}日 ${
h}:${
mm}:${
s}`;
}
return timeStr;
}
},
效果如下图：
