timeago.js
时间处理插件,它可以轻易的将时间戳转换成如:5分钟前,约3小时前这样的更友好易读的时间轴,而且使用timeago.js无需刷新页面即自动更新页面时间的显示
1. 下载 timeago.js
2. 引入 timeago.js
3. 使用 timeago 类
在vue项目中使用
let MillisecondToDate = (time) => {
var str = ''
if (time !== null || time !== '') {
let timeagoInstance = new Timeageo()
str = timeagoInstance.format(time, 'zh_CN')
}
return str
}
/**
* 格式化日期或时间
* @param {string} time 需要格式化的时间
* @param {bool} friendly 是否是fromNow
*/
let getLastTimeStr = (time, friendly) => {
if (friendly) {
return MillisecondToDate(time)
} else {
return fmtDate(new Date(time), 'yyyy-MM-dd hh:mm')
}
}
格式化时间
/**
* 对Date的扩展,将 Date 转化为指定格式的String
* 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符,
* 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字)
* 例子:
* (new Date()).Format('yyyy-MM-dd hh:mm:ss.S') ==> 2006-07-02 08:09:04.423
* (new Date()).Format('yyyy-M-d h:m:s.S') ==> 2006-7-2 8:9:4.18
*/
const fmtDate = (date, fmt) => {
// 拼接月日时分秒到数组o中
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 (var 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
}
如果使用时间戳转timeago那么getLastTimeStr传入时间和true调用h函数MillisecondToDate,否则调用格式化时间
export出来
export default {
MillisecondToDate: MillisecondToDate,
getLastTimeStr: getLastTimeStr
}
在使用export暴露模块的时候es6和cmd的区别容易搞混,
接的博客会编写着两个的区别以及使用