最近项目中遇到一个问题, 提交后的时间后台会返回'2018-01-05T17:32:03'
这样的一个时间格式, 在展示的是则只需要展示'2018-01-05'
. 这种需求应该有很多种方法, 这里我列举两个.
- 强行截取:
substr(0, 10)
; 任意截取方法 - 时间格式化: 通过
new Date()
方法格式化时间
详细说一个第二种时间格式化的问题
初始时只写了最简单时间格式化方法:
formatDate(date) {
const _date = date ? new Date(date) : new Date(); // 这里判断是否有传入的时间, 如果没有时间则创建当前时间
const _y = _date.getFullYear(),
_m = _date.getMonth() + 1,
_d = _date.getDate();
if(_m < 10) {
_m = `0${_m}`
};
if(_d < 10) {
_d = `0${_d}`
};
return +`${_y}-${_m}-${_d}`;
}
这样写是有浏览器兼容性问题的, 就拿'2018-01-05T17:32:03'
这个事件来说, 在QQ浏览器下格式化的时间会是'2018-01-06'
, 解决这个问题在格式化时要替换掉时间中的'T'字符, 当我以为这样就很稳妥时我打开了一下ie浏览器结果发现格式化后的时间都为NAN了, 又去查找症结所在.
在IE和Safari时间转化时间戳时'yyyy-mm-dd'是不能转化为时间戳, 需要'yyyy/mm/dd hh:ii:ss'格式才能正取转化.
下面给出完整代码:
export default class DateChoice {
/**
@agruments config {
s: '-', // 格式化时间分隔符 默认为'-'
}
**/
constructor(config = {}) {
this.s = config.s || (config.s === '' ? '' : '-');
this.now = new Date(); // 当前日期
this.nowDayOfWeek = this.now.getDay() - 1; // 今天本周的第几天
this.nowDay = this.now.getDate(); // 当前日
this.nowMonth = this.now.getMonth() + 1; // 当前月
this.nowYear = this.now.getYear(); // 当前年
this.nowYear += (this.nowYear < 2000) ? 1900 : 0; //
this.lastMonthDate = new Date(); //上月日期
this.lastMonthDate.setDate(1);
this.lastMonthDate.setMonth(this.lastMonthDate.getMonth() - 1);
this.lastYear = this.lastMonthDate.getYear();
this.lastMonth = this.lastMonthDate.getMonth();
}
// 格式化日期:yyyy-MM-dd @argument date 不传则获取今天日期
formatDate(date){
if(typeof date === 'string' && date.includes('T')) {
date = date.replace('T', ' ').replace(/\-/g, '/'); //注意:指定一个具体的时间转换时间戳,需要yyyy/mm/dd hh:ii:ss格式,yyyy-mm-dd在IE和Safari下是有问题的。
};
const D = date ? new Date(date) : new Date();
let myyear = D.getFullYear();
let mymonth = D.getMonth() + 1;
let myweekday = D.getDate();
if (mymonth < 10) {
mymonth = '0' + mymonth;
}
if (myweekday < 10) {
myweekday = '0' + myweekday;
}
return (myyear + this.s + mymonth + this.s + myweekday);
}
// 获得某月的天数
getMonthDays(myMonth) {
const monthStartDate = new Date(this.nowYear, myMonth - 1, 1);
const monthEndDate = new Date(this.nowYear, myMonth, 1);
const days = (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24);
return days;
}
// 获得本季度的开始月份
getQuarterStartMonth() {
let quarterStartMonth = 1;
if (this.nowMonth < 4) {
quarterStartMonth = 1;
}
if (3 < this.nowMonth && this.nowMonth < 7) {
quarterStartMonth = 4;
}
if (6 < this.nowMonth && this.nowMonth < 10) {
quarterStartMonth = 7;
}
if (this.nowMonth > 9) {
quarterStartMonth = 10;
}
return quarterStartMonth;
}
// 获得今天之前的日期
getTodayBeforeDate(num) {
const beforeDate = new Date(this.nowYear, this.nowMonth - 1, this.nowDay - num);
return this.formatDate(beforeDate);
}
// 获得今天之后的日期
getTodayAfterDate(num) {
const afterDate = new Date(this.nowYear, this.nowMonth - 1, this.nowDay + num);
return this.formatDate(afterDate);
}
// 获得本周的开始日期
getWeekStartDate() {
const weekStartDate = new Date(this.nowYear, this.nowMonth - 1, this.nowDay - this.nowDayOfWeek);
return this.formatDate(weekStartDate);
}
// 获得本周的结束日期
getWeekEndDate() {
const weekEndDate = new Date(this.nowYear, this.nowMonth - 1, this.nowDay + (6 - this.nowDayOfWeek));
return this.formatDate(weekEndDate);
}
// 获得上周的开始日期
getLastWeekStartDate() {
const weekStartDate = new Date(this.nowYear, this.nowMonth - 1, this.nowDay - this.nowDayOfWeek - 7);
return this.formatDate(weekStartDate);
}
// 获得上周的结束日期
getLastWeekEndDate() {
const weekEndDate = new Date(this.nowYear, this.nowMonth - 1, this.nowDay - this.nowDayOfWeek - 1);
return this.formatDate(weekEndDate);
}
// 获得本月的开始日期
getMonthStartDate() {
const monthStartDate = new Date(this.nowYear, this.nowMonth - 1, 1);
return this.formatDate(monthStartDate);
}
// 获得本月的结束日期
getMonthEndDate() {
const monthEndDate = new Date(this.nowYear, this.nowMonth - 1, this.getMonthDays(this.nowMonth));
return this.formatDate(monthEndDate);
}
// 获得本季度的开始日期
getQuarterStartDate() {
const quarterStartDate = new Date(this.nowYear, this.getQuarterStartMonth() - 1, 1);
return this.formatDate(quarterStartDate);
}
// 获得本季度的结束日期
getQuarterEndDate() {
const quarterEndMonth = this.getQuarterStartMonth() + 2;
const quarterStartDate = new Date(this.nowYear, quarterEndMonth - 1, this.getMonthDays(quarterEndMonth));
return this.formatDate(quarterStartDate);
}
}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。