ElementUI 日期范圍組件參數(shù)設(shè)置

在搜索的時候我們經(jīng)常會根據(jù)日期范圍篩選數(shù)據(jù),后端存儲數(shù)據(jù)一般都是標準時間,前端傳參也應(yīng)該是帶時間的標準時間,即使我們查詢的只是日期范圍不是日期時間范圍。

1、組件默認就是標準時間,這個是ok的,沒啥問題,但是當(dāng)我們選擇同一天的時候,問題就來了,開始時間和結(jié)束時間是一樣的

參數(shù)截圖

我們期望的效果是

mawbDateStart: 2020-04-16T16:00:00.000Z
mawbDateEnd: 2020-04-17T15:59:59.000Z

這個時候需要我們在組件上加上默認時間的參數(shù)

:default-time="['00:00:00', '23:59:59']"

2、若在搜索列表中有日期時間的展示,也需要轉(zhuǎn)換成為本地時間展示,具體方法不再贅述,可以根據(jù)具體需求自己寫方法函數(shù)(關(guān)于時間建議在統(tǒng)一的時間工具文件中管理,注冊過濾器),或者使用moment.js轉(zhuǎn)化時間(下載地址:https://momentjs.com/)。
3、涉及到Safari瀏覽器時間的回填問題(以下瀏覽器指的是Safari)
若是后端返回2020-03-15 12:23:34或者2020/03/15T12:23:34這種時間格式,請注意,前方有坑,瀏覽器會報錯Invalid Date,不能識別這種日期格式,需要人為地把”-“改為”/“,或者讓后端規(guī)范返回值,再賦值到日期組件的model值里面

// 需要將'-'替換成'/',將'T'替換成空格
var dateStr = "2020-03-15 12:23:34"
var date = new Date(dateStr.replace(/\-/g, "/").replace(/T/, ' '))

以下是瀏覽器支持的格式

> new Date('2020/03/15 12:23:34')
< Sun Mar 15 2020 12:23:34 GMT+0800 (CST)

> new Date('2020-03-15T16:00:00.000Z')
< Fri Mar 16 2020 00:00:00 GMT+0800 (CST)

> new Date('2020-03-15')
< Thu Mar 15 2020 08:00:00 GMT+0800 (CST)

> new Date('2020-03-15T12:23:34')
< Sun Mar 15 2020 20:23:34 GMT+0800 (CST)
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 前端開發(fā)面試題 面試題目: 根據(jù)你的等級和職位的變化,入門級到專家級,廣度和深度都會有所增加。 題目類型: 理論知...
    怡寶丶閱讀 2,694評論 0 7
  • 第5章 引用類型(返回首頁) 本章內(nèi)容 使用對象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類型 使用基本類型...
    大學(xué)一百閱讀 3,692評論 0 4
  • 有時候開始翻翻別人朋友圈的時候 在想自己究竟是要點什么 姑娘做幼師找個家里做生意的男朋友 平時閑來和女孩子們約會吃...
    4948c28a5457閱讀 408評論 0 0
  • 文/紫月 嘴上不會說的人,為人最誠懇。 沒有花言巧語的天分, 只有善待別人的一顆心; 沒有虛偽做作的圓潤, 只有出...
    木夏半年閱讀 266評論 4 5
  • 比如,小時侯向老師告狀的時候經(jīng)常說:when I was reading my book he gave me a...
    老祝讀書閱讀 2,479評論 0 1

友情鏈接更多精彩內(nèi)容