明霞山资源网 Design By www.htccd.com
在methods中创建方法showtime,传入要跟当前时间要对比的时间
showtime(time) {
let date =
typeof time === "number"
"").replace(/-/g, "/"));
let diff = (new Date().getTime() - date.getTime()) / 1000;
let dayDiff = Math.floor(diff / 86400);
let isValidDate =
Object.prototype.toString.call(date) === "[object Date]" &&
!isNaN(date.getTime());
if (!isValidDate) {
window.console.error("不是有效日期格式");
}
const formatDate = function(date) {
let today = new Date(date);
let year = today.getFullYear();
let month = ("0" + (today.getMonth() + 1)).slice(-2);
let day = ("0" + today.getDate()).slice(-2);
let hour = today.getHours();
let minute = today.getMinutes();
let second = today.getSeconds();
return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
};
if (isNaN(dayDiff) || dayDiff < 0 || dayDiff >= 31) {
return formatDate(date);
}
return (
(dayDiff === 0 &&
((diff < 60 && "刚刚") ||
(diff < 120 && "1分钟前") ||
(diff < 3600 && Math.floor(diff / 60) + "分钟前") ||
(diff < 7200 && "1小时前") ||
(diff < 86400 && Math.floor(diff / 3600) + "小时前"))) ||
(dayDiff === 1 && "昨天") ||
(dayDiff < 7 && dayDiff + "天前") ||
(dayDiff < 31 && Math.ceil(dayDiff / 7) + "周前")
);
},
补充知识:Vue中根据时间戳计算时间间隔-年龄
实现目标
由于数据库没有直接存储用户的年龄,只有以时间戳为格式的出生日期,所以不得不在前端做一下计算处理。下面就和大家一起来看一下前端JS的实现方法。
功能代码
由于时间戳是包含了具体时间的,所以在转日期后截取年月日部分即可。
再获取当前的时期计算间隔得出用户的年龄。
// 获取用户年龄
this.userAge = this.toAge(timeStamp);
console.log(this.userAge);
// 根据返回的日期计算间隔
toAge(timeStamp) {
let birthDate = this.toDate(timeStamp).substr(0, 4);
let newDate = new Date().getFullYear();
return (newDate - parseInt(birthDate));
}
// 时间戳转日期
toDate(number) {
let n = number;
let date = new Date(n);
let Y = date.getFullYear() + '/';
let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '/';
let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
return (Y + M + D)
}
内容小结
又是一个小功能的实现,一边记录下自己的代码,一边和大家分享平时代码的点滴,希望能给大家一个参考,也希望大家多多支持。
标签:
Vue,创建时间,当前时间
明霞山资源网 Design By www.htccd.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
明霞山资源网 Design By www.htccd.com
暂无评论...
《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。
