在搜索的時(shí)候我們經(jīng)常會根據(jù)日期范圍篩選數(shù)據(jù)堡纬,后端存儲數(shù)據(jù)一般都是標(biāo)準(zhǔn)時(shí)間乖订,前端傳參也應(yīng)該是帶時(shí)間的標(biāo)準(zhǔn)時(shí)間板壮,即使我們查詢的只是日期范圍不是日期時(shí)間范圍斥难。
1枝嘶、組件默認(rèn)就是標(biāo)準(zhǔn)時(shí)間,這個(gè)是ok的哑诊,沒啥問題群扶,但是當(dāng)我們選擇同一天的時(shí)候,問題就來了,開始時(shí)間和結(jié)束時(shí)間是一樣的
我們期望的效果是
mawbDateStart: 2020-04-16T16:00:00.000Z
mawbDateEnd: 2020-04-17T15:59:59.000Z
這個(gè)時(shí)候需要我們在組件上加上默認(rèn)時(shí)間的參數(shù)
:default-time="['00:00:00', '23:59:59']"
2竞阐、若在搜索列表中有日期時(shí)間的展示提茁,也需要轉(zhuǎn)換成為本地時(shí)間展示,具體方法不再贅述馁菜,可以根據(jù)具體需求自己寫方法函數(shù)(關(guān)于時(shí)間建議在統(tǒng)一的時(shí)間工具文件中管理,注冊過濾器)铃岔,或者使用moment.js轉(zhuǎn)化時(shí)間(下載地址:https://momentjs.com/)汪疮。
3、涉及到Safari瀏覽器時(shí)間的回填問題(以下瀏覽器指的是Safari)
若是后端返回2020-03-15 12:23:34或者2020/03/15T12:23:34這種時(shí)間格式毁习,請注意智嚷,前方有坑,瀏覽器會報(bào)錯(cuò)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)