Vue如何使用Dayjs計算常用日期詳解
在使用vue開發(fā)項目時,前端常常需要計算一些日期時間,如:
計算周月截止日期 計算XX天前/后的日期 將時間戳轉換為日期(YYYY-MM-DD) 計算月天數(shù) 日期轉時間戳推薦一個輕量的處理時間和日期的 JavaScript 庫:dayjs
使用這個插件計算常用日期十分方便
1、在項目中安裝dayjs,命令為:npm install dayjs --save
2、在main.js中,添加如下2句代碼
import dayjs from ’dayjs’;Vue.prototype.dayjs = dayjs;
3、在頁面需要使用的地方,直接使用
當前日期或時間戳轉換,format后面就跟著想要格式化的內容,**dayjs( ) **括號中不放任何參數(shù),默認為當前日期,也可以放一個時間戳,直接轉換
(注意:使用Element組件的日期選擇器,其value-format屬性要求:
組件 Dayjs(format) Element(value-format) 年 YYYY yyyy 月 MM MM 日 DD dd 時 HH HH 分 mm mm 秒 ss ss
其中年和日的表達略有不同,容易混)
this.dayjs().format('YYYY-MM-DD')this.dayjs().format('YYYY-MM-DD HH:mm')this.dayjs(1614787200000).format('YYYY-MM-DD HH:mm:ss')
2.計算某周/某月/某年的起始截止日期,所使用到的方法為startOf(),endOf(),括號中可以是'week' 、 “month”、 “year”(ps:加format是為了更加直觀)
this.dayjs().startOf('week');this.dayjs().endOf('week').format('YYYY-MM-DD');this.dayjs().startOf('month').format('YYYY-MM-DD');this.dayjs('2021-02-09').endOf('month').format('YYYY-MM-DD');
計算日期,如幾天前、幾天后日期,
前(減) 后(加) subtract(參數(shù)1,參數(shù)2) add(參數(shù)1,參數(shù)2) 參數(shù)1 數(shù)字 參數(shù)2 單位(“week” 、 “month”、 “year”)
this.dayjs().subtract(3,’day’).format('YYYY-MM-DD')this.dayjs().subtract(3,’month’).format('YYYY-MM-DD')this.dayjs().add(12,’day’).format('YYYY-MM-DD')this.dayjs(’2021-03-12’).add(45,’day’).format('YYYY-MM-DD')
5. 獲取月天數(shù),使用方法dayInMonth()
this.dayjs().daysInMonth(); this.dayjs('2021-02-09').daysInMonth(); this.dayjs('2021-01').daysInMonth();
6、普通日期轉換為時間戳
this.dayjs().unix()this.dayjs(’2020-10-04’).unix()
總結
到此這篇關于Vue如何使用Dayjs計算常用日期的文章就介紹到這了,更多相關Vue計算常用日期內容請搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持好吧啦網(wǎng)!
相關文章:
1. phpstudy apache開啟ssi使用詳解2. django創(chuàng)建css文件夾的具體方法3. .NET SkiaSharp 生成二維碼驗證碼及指定區(qū)域截取方法實現(xiàn)4. docker容器調用yum報錯的解決辦法5. 存儲于xml中需要的HTML轉義代碼6. CentOS郵件服務器搭建系列—— POP / IMAP 服務器的構建( Dovecot )7. IntelliJ IDEA創(chuàng)建web項目的方法8. 原生JS實現(xiàn)記憶翻牌游戲9. ASP中實現(xiàn)字符部位類似.NET里String對象的PadLeft和PadRight函數(shù)10. javascript xml xsl取值及數(shù)據(jù)修改第1/2頁
