① moment.js的方法總結
總結一個非常實用的日期工具類moment.js,日期獲取,格式化等。
都是以前工作中遇到的,我會在使用工具類的時候新建一個js,工作中遇到要顯示什麼都在這個文件里嘗試掘信,所以這個順序是我工作中遇到然後在js文件中嘗試的順序,可能順序稍微亂一些,但是大致沒有什麼問題。
1.取當天時間,以YYYY年MM月DD日形式顯示
2.任意時間戳格式化,以YYYY-MM-DD HH:mm:ss形式顯示
可以簡單理解為上周倒數第幾天,上周倒數第三天就是上周五了,和當天日期無關
注意這個地方,日期不是.day()/days()
結合t14,t15,t16就可以輸出你想要的任何和當前日期、月份相關的日期
例如:我想獲取去年今天的完整日期,如:今天是2018-7-23,我判飢輪要輸出的是2017-7-23
當然這不是獲取去年今天日期最好的辦法肢頃,但你可以拼出很多你想要的組合,下面會介紹更好的獲取去年今日的方法。
這個的應用是獲取時間戳過期時間
比較也很簡單,只要獲取當前時間,一樣的format用><=號比較就可以了
例如:今天2018-7-23,獲取到的時間是2018-7-18
② Moment.js 中文文檔
MomentJs
本來想寫這么一篇翻譯稿呢,發現中文文檔已經有人在運維了,總的來講還是很欣慰的。
來這邊寫東西還有兩個原因
不過翻譯+學習的方式我還是很贊同的。
另外,Moment.js 這個庫還是很贊的一個時間處理庫,如謹沒果你在瞎改開發中遇到,拿走,不磨晌判謝。
③ vue中使用moment.js
1.先安裝 npm install moment
2.在使用的組件裡面引入 var moment = require('moment');
moment().format();
//官網 http://momentjs.cn/docs/#/parsing/
3.將時間戳轉為標准日期
let day2 = moment(1632983439000).format("YYYY-MM-DD");
console.log(day2);
或者轉為帶T的格式等等
4.再將標准日期轉為時間戳
let day3 = moment(day2).valueOf();
console.log(day3);
5.默認情況下,moment 會解析並以本地時間顯示。
如果要解析或以 UTC 顯示 moment,則可以使用 moment.utc() 而不是 moment()。
moment().format(); // 2013-02-04T10:35:24-08:00
moment.utc().format(); // 2013-02-04T18:35:24+00:00
重要的是要注意,盡管上面的顯示有所不同,但它們在同一時間都是相同的 moment。
vara = moment();varb = moment.utc();a.format();// 2013-02-04T10:35:24-08:00b.format();// 2013-02-04T18:35:24+00:00a.valueOf();// 1360002924000b.valueOf();// 1360002924000
使用 moment.utc() 創建的任何 moment 都將會處於 UTC 模式中,而使用 moment() 創建的任何 moment 則不會。
④ 怎樣將moment.js設置成中文
首先在github上找到中文字典部分:
[javascript] view plain
moment.defineLocale('zh-cn', {
months : '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('_'),
monthsShort : '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),
weekdays : '星期日_星期一_星期二_星期三_星期四_星期五_星期六'.split('_'),
weekdaysShort : '周日_周一_周二_周三_周四_周五_周六'.split('_'),
weekdaysMin : '日_一_二_三_四_五_六'.split('_'),
longDateFormat : {
LT : 'Ah點mm分',
LTS : 'Ah點m分s秒',
L : 'YYYY-MM-DD',
LL : 'YYYY年MMMD日',
LLL : 'YYYY年MMMD日Ah點mm分',
LLLL : 'YYYY年MMMD日ddddAh點mm分',
l : 'YYYY-MM-DD',
ll : 'YYYY年MMMD日',
lll : 'YYYY年MMMD日Ah點mm分',
llll : 'YYYY年MMMD日ddddAh點mm分'
},
meridiemParse: /凌晨|早上|上午|中午|下午|晚上/,
meridiemHour: function (hour, meridiem) {
if (hour === 12) {
hour = 0;
}
if (meridiem === '凌晨' || meridiem === '早上' ||
meridiem === '上午') {
return hour;
} else if (meridiem === '下午' || meridiem === '晚上') {
return hour + 12;
} else {
// '中午'
return hour >= 11 ? hour : hour + 12;
}
},
meridiem : function (hour, minute, isLower) {
var hm = hour * 100 + minute;
if (hm < 600) {
return '凌晨';
} else if (hm < 900) {
return '早上';
} else if (hm < 1130) {
return '上午';
} else if (hm < 1230) {
return '中午';
} else if (hm < 1800) {
return '下午';
} else {
return '晚上';
}
},
calendar : {
sameDay : function () {
return this.minutes() === 0 ? '[今天]Ah[點整]' : '[今天]LT';
},
nextDay : function () {
return this.minutes() === 0 ? '[明天]Ah[點整]' : '[明天]LT';
},
lastDay : function () {
return this.minutes() === 0 ? '[昨天]Ah[點整]' : '[昨天]LT';
},
nextWeek : function () {
var startOfWeek, prefix;
startOfWeek = moment().startOf('week');
prefix = this.unix() - startOfWeek.unix() >= 7 * 24 * 3600 ? '[下]' : '[本]';
return this.minutes() === 0 ? prefix + 'dddAh點整' : prefix + 'dddAh點mm';
},
lastWeek : function () {
var startOfWeek, prefix;
startOfWeek = moment().startOf('week');
prefix = this.unix() < startOfWeek.unix() ? '[上]' : '[本]';
return this.minutes() === 0 ? prefix + 'dddAh點整' : prefix + 'dddAh點mm';
},
sameElse : 'LL'
},
ordinalParse: /\d{1,2}(日|月|周)/,
ordinal : function (number, period) {
switch (period) {
case 'd':
case 'D':
case 'DDD':
return number + '日';
case 'M':
return number + '月';
case 'w':
case 'W':
return number + '周';
default:
return number;
}
},
relativeTime : {
future : '%s內',
past : '%s前',
s : '幾秒',
m : '1 分鍾',
mm : '%d 分鍾',
h : '1 小時',
hh : '%d 小時',
d : '1 天',
dd : '%d 天',
M : '1 個月',
MM : '%d 個月',
y : '1 年',
yy : '%d 年'
},
week : {
// GB/T 7408-1994《數據元和交換格式·信息交換·日期和時間表示法》與ISO 8601:1988等效
dow : 1, // Monday is the first day of the week.
doy : 4 // The week that contains Jan 4th is the first week of the year.
}
});
然後,把這段代碼復制到moment.js中,位置在最後一句 「return _moment;」 的前面,如下:
[javascript] view plain
//中文支持
moment.defineLocale('zh-cn', {
months : '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('_'),
monthsShort : '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),
//...略
return _moment;
運行,但是不起作用,還是顯示英文日期。
再仔細觀察代碼,moment.js中最後返回的變數叫做 _moment,多了個下劃線,於是修改剛才那段代碼的開頭部分,把moment改為_moment,成功!
[javascript] view plain
//中文支持
_moment.defineLocale('zh-cn', {
問題解決!
⑤ vue中使用moment.js 以及中文顯示
npm install moment
只需在main.js使用
要轉換的值顫檔陵必須蠢賣是date類型或者是number類茄戚型的時間戳,不然可能報錯Invalid Date