ant design 日期格式化的實(shí)現(xiàn)
更新時(shí)間：2020年10月27日 11:23:46 作者：durex_er
這篇文章主要介紹了ant design 日期格式化的實(shí)現(xiàn)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
今天寫項(xiàng)目的時(shí)候用到ant design中的日期組件，但是由于用ant design日期組件取得的值是moment類型，而往數(shù)據(jù)庫中保存需要的是字符串類型.這里就用到了moment日期轉(zhuǎn)換
第一種寫法
我取得的值是年月
如：201806
第二種寫法
moment().format('YYYY-MM-DD')
第三種寫法
moment(Date.now()).format('YYYY-MM-DD')
獲取本地日期的下個(gè)月
window.moment().add(1, 'months')
獲取當(dāng)前日期的下一天
window.moment().add(1, 'days')
參考地址 http://momentjs.com/ 記得用的話別忘了引入他moment.js
補(bǔ)充知識(shí)：ant design使用日期控件涉及的日期格式問題
moment的基本使用：
var moment = require('moment');
console.log("001===>>> ",moment().format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間
console.log("002===>>> ",moment().add(-1,'year').format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間 前一年
console.log("003===>>> ",moment().add(-1,'month').format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間 前一月
console.log("004===>>> ",moment().add(-1,'week').format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間 前一周
console.log("005===>>> ",moment().add(-1,'days').format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間 前一天
console.log("006===>>> ",moment().add(-1,'hour').format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間 前一小時(shí)
console.log("007===>>> ",moment().add(-1,'minute').format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間 前一分鐘
console.log("008===>>> ",moment().add(-1,'second').format('YYYY-MM-DD HH:mm:ss')); //當(dāng)前時(shí)間 前一秒
console.log("009===>>> ",moment().utc().format("YYYY-MM-DD HH:mm:ss")); //當(dāng)前時(shí)間 UTC格式化
//001===>>> 2016-06-28 14:45:02
//002===>>> 2015-06-28 14:45:02
//003===>>> 2016-05-28 14:45:02
//004===>>> 2016-06-21 14:45:02
//005===>>> 2016-06-27 14:45:02
//006===>>> 2016-06-28 13:45:02
//007===>>> 2016-06-28 14:44:02
//008===>>> 2016-06-28 14:45:01
//009===>>> 2016-06-28 06:45:02
對(duì)form表單中的日期格式進(jìn)行轉(zhuǎn)換方法：
function filterQueryObj(obj, dateFormatOne, dateFormatTwo) {
// 將提交的值中undefined/null去掉
const searchValue = {};
(Object.keys(obj) || {}).forEach(key => {
if (obj[key]) {
// 對(duì)于js的日期類型, 要轉(zhuǎn)換成字符串再傳給后端
if (obj[key] instanceof Date) {
searchValue[key] = obj[key].format(dateFormatOne || 'yyyy-MM-dd');
} else if (moment.isMoment(obj[key])) {
// 處理moment對(duì)象
searchValue[key] = obj[key].format(dateFormatTwo || 'YYYY-MM-DD');
} else if (typeof obj[key] === 'string') {
searchValue[key] = _.trim(obj[key]); // 情況字符串左右的空格
} else if (_.isArray(obj[key]) && obj[key].length === 0) {
// 如果是數(shù)組，那么如果是空值，則不傳
delete searchValue[key];
} else {
searchValue[key] = obj[key];
}
}
});
return searchValue;
}
去掉空格：
// 去掉空格
function trim(str) {
return str.split(' ');
// str.replace(/(^\s*)|(\s*$)/g, "");
}
以上這篇ant design 日期格式化的實(shí)現(xiàn)就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
解決Vue Loading PostCSS Plugin failed:Cann
這篇文章主要介紹了解決Vue Loading PostCSS Plugin failed:Cannot find module autoprefixer問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
下面小編就為大家分享一篇Vue-路由導(dǎo)航菜單欄的高亮設(shè)置方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-03-03
下面小編就為大家分享一篇完美解決axios在ie下的兼容性問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-03-03
vue-router路由參數(shù)刷新消失的問題解決方法
本篇文章主要介紹了vue-router路由參數(shù)刷新消失的問題解決方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
這篇文章主要介紹了如何解決vue項(xiàng)目打包后文件過大問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
vue實(shí)現(xiàn)的上拉加載更多數(shù)據(jù)/分頁功能示例
這篇文章主要介紹了vue實(shí)現(xiàn)的上拉加載更多數(shù)據(jù)/分頁功能,涉及基于vue的事件響應(yīng)、數(shù)據(jù)交互等相關(guān)操作技巧,需要的朋友可以參考下2019-05-05
詳解Vue-Router源碼分析路由實(shí)現(xiàn)原理
這篇文章主要介紹了Vue-Router源碼分析路由實(shí)現(xiàn)原理，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
Vue設(shè)置提示和警告彈出框?qū)崙?zhàn)案例
頁面中會(huì)有很多時(shí)候需要彈窗提示,下面這篇文章主要給大家介紹了關(guān)于Vue設(shè)置提示和警告彈出框的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-02-02
解決Vue項(xiàng)目Network:?unavailable的問題
項(xiàng)目只能通過Local訪問而不能通過Network訪問,本文主要介紹了解決Vue項(xiàng)目Network:?unavailable的問題,具有一定的參考價(jià)值,感興趣的可以了解一下2024-06-06
這篇文章主要介紹了vue獲取或者改變vuex中的值方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09