vue獲取當(dāng)前日期時(shí)間(使用moment和new?Date())
更新時(shí)間：2023年06月02日 09:25:09 作者：豬大俠0.0
在項(xiàng)目開(kāi)發(fā)中我遇到了日期范圍選擇器,兩種獲取當(dāng)前日期并做處理的寫法,這里記錄一下,下面這篇文章主要給大家介紹了關(guān)于vue獲取當(dāng)前日期時(shí)間(使用moment和new?Date())的相關(guān)資料,需要的朋友可以參考下
vue獲取當(dāng)前日期時(shí)間
開(kāi)發(fā)中會(huì)有要獲取當(dāng)前日期的需求，有的是獲取到當(dāng)前月份，有的是精確到分秒。
而且日期的格式還不一樣，一下有兩種獲取時(shí)間的方式：
1 new Date()+拼接
格式一：
- yy/MM/dd hh:mm:ss – 例如：2022/05/01 00:00:00
- yy/M/d hh:mm:ss – 例如：2022/5/1 00:00:00
/**
* 獲取當(dāng)前時(shí)間
*/
currentTime() {
var date = new Date();
var year = date.getFullYear(); //月份從0~11，所以加一
let month = date.getMonth();
console.log("month",month);
var dateArr = [
date.getMonth() + 1,
date.getDate(),
date.getHours(),
date.getMinutes(),
date.getSeconds(),
];
//如果格式是MM則需要此步驟，如果是M格式則此循環(huán)注釋掉
for (var i = 0; i < dateArr.length; i++) {
if (dateArr[i] >= 1 && dateArr[i] <= 9) {
dateArr[i] = "0" + dateArr[i];
}
}
var strDate =
year +
"/" +
dateArr[0] +
"/" +
dateArr[1] +
" " +
dateArr[2] +
":" +
dateArr[3] +
":" +
dateArr[4];
//此處可以拿外部的變量接收，也可直接返回 strDate:2022-05-01 13:25:30
//this.date = strDate;
console.log("strDate",strDate);
},格式二：
- yy-MM-dd hh:mm:ss – 例如：2022-05-01 00:00:00
- yy-MM-dd hh:mm:ss – 例如：2022-05-01 00:00:00
/**
* 獲取當(dāng)前時(shí)間
*/
currentTime() {
var date = new Date();
var year = date.getFullYear(); //月份從0~11，所以加一
let month = date.getMonth();
console.log("month",month);
var dateArr = [
date.getMonth() + 1,
date.getDate(),
date.getHours(),
date.getMinutes(),
date.getSeconds(),
];
//如果格式是MM則需要此步驟，如果是M格式則此循環(huán)注釋掉
for (var i = 0; i < dateArr.length; i++) {
if (dateArr[i] >= 1 && dateArr[i] <= 9) {
dateArr[i] = "0" + dateArr[i];
}
}
var strDate =
year +
"/" +
dateArr[0] +
"/" +
dateArr[1] +
" " +
dateArr[2] +
":" +
dateArr[3] +
":" +
dateArr[4];
//此處可以拿外部的變量接收 strDate:2022-05-01 13:25:30
//this.date = strDate;
console.log("strDate",strDate);
},獲取當(dāng)前月份
/**
* 獲取當(dāng)前月份，可直接返回
*/
currentTime() {
var date = new Date();
var year = date.getFullYear(); //月份從0~11，所以加一
let month = date.getMonth() + 1;
console.log("month", month);
//如果格式是MM則需要此步驟，如果是M格式則此處注釋掉
if (month >= 1 && month <= 9) {
month = "0" + month;
}
let strDate = year + "-" + month;
return strDate;
},2 moment()函數(shù)獲取
用法：
this.$moment().format('YYYY-MM-DD HH:mm:ss')此函數(shù)很方便，只需在format設(shè)置自己需要的格式即可，效果如下
總結(jié)
到此這篇關(guān)于vue獲取當(dāng)前日期時(shí)間的文章就介紹到這了,更多相關(guān)vue獲取當(dāng)前日期時(shí)間內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要給大家介紹了關(guān)于Vue中router-view無(wú)法顯示的解決辦法,router-view組件作為vue最核心的路由管理組件,在項(xiàng)目中作為路由管理經(jīng)常被使用到,需要的朋友可以參考下2023-07-07
這篇文章主要給大家介紹了Vue3自定義指令的相關(guān)資料,自定義指令是一種在Vue應(yīng)用程序中擴(kuò)展HTML標(biāo)簽的能力,文中通過(guò)圖文介紹的非常詳細(xì),需要的朋友可以參考下2023-09-09
vue props傳值失敗 輸出undefined的解決方法
今天小編就為大家分享一篇vue props傳值失敗 輸出undefined的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
這篇文章主要介紹了vue3中如何使用dayjs問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
Vue插件報(bào)錯(cuò):Vue.js is detected on this page.問(wèn)題解決
這篇文章主要介紹了Vue插件報(bào)錯(cuò):Vue.js is detected on this page.問(wèn)題解決,本篇文章通過(guò)簡(jiǎn)要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-07-07
這篇文章主要介紹了Vue 的鉤子函數(shù)，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-09-09
Javascript結(jié)合Vue實(shí)現(xiàn)對(duì)任意迷宮圖片的自動(dòng)尋路
本文將結(jié)合實(shí)例代碼介紹Javascript結(jié)合Vue實(shí)現(xiàn)對(duì)任意迷宮圖片的自動(dòng)尋路，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-06-06
vue3+ts+vite使用el-table表格渲染記錄重復(fù)情況
這篇文章主要給大家介紹了關(guān)于vue3+ts+vite使用el-table表格渲染記錄重復(fù)情況的相關(guān)資料,我們可以通過(guò)合并渲染、數(shù)據(jù)緩存或虛擬化等技術(shù)來(lái)減少重復(fù)渲染的次數(shù),文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-12-12
這篇文章主要介紹了詳解Nuxt.js部署及踩過(guò)的坑，Nuxt.js 提供了兩種發(fā)布部署應(yīng)用的方式：服務(wù)端渲染應(yīng)用部署 和 靜態(tài)應(yīng)用部署。本文主要說(shuō)說(shuō)服務(wù)端渲染應(yīng)用部署，感興趣的小伙伴們可以參考一下2018-08-08
Vue.js 3.x 中的響應(yīng)式數(shù)據(jù)ref 與 reactive詳解
ref 和 reactive 是 Vue.js 3 中用于創(chuàng)建響應(yīng)式數(shù)據(jù)的兩個(gè)關(guān)鍵函數(shù),它們分別適用于不同類型的數(shù)據(jù),幫助我們更好地組織和管理組件的狀態(tài),這篇文章主要介紹了Vue.js 3.x 中的響應(yīng)式數(shù)據(jù)：ref 與 reactive,需要的朋友可以參考下2024-01-01