在案例展示中經(jīng)常包含日期這一信息，而在不同的應(yīng)用場(chǎng)景下對(duì)日期的格式要求也不盡相同。其實(shí)日期最終的展示結(jié)果本質(zhì)上還是一個(gè)字符串，我們要做的只是把日期截取然后組合成與標(biāo)準(zhǔn)模型一致的樣式，下面我們就來(lái)講一講如何在ivx中通過(guò)自定義函數(shù)做這種日期的格式化處理。

1.自定義函數(shù)

在這個(gè)demo中使用了一些自定義函數(shù)，雖然ivx的案例中一般不需要寫(xiě)代碼，但是依舊提供了代碼功能。自定義函數(shù)組件可以接收和返回參數(shù)，在函數(shù)內(nèi)部可以自定義對(duì)參數(shù)處理的函數(shù)，這里以“完全日期時(shí)間”這個(gè)自定義函數(shù)對(duì)函數(shù)中的代碼做一個(gè)說(shuō)明。

這個(gè)函數(shù)的接收參數(shù)是time，其類型為需要轉(zhuǎn)化的值中“2020-04-03 09:21:17”這樣一個(gè)形式的表示時(shí)間的字符串。函數(shù)中最后一行的timeL是函數(shù)的返回參數(shù)，而timel就是這個(gè)返回參數(shù)的具體值。在函數(shù)中var用來(lái)定義一個(gè)變量，我們首先創(chuàng)建一個(gè)名為da的變量，然后把time從字符串類型轉(zhuǎn)換成一個(gè)時(shí)間類型再賦值給da。

getFullYear()、getMonth()、da.getDate()、getDay()、getHours()、getMinutes()和getSeconds()是一些函數(shù)方法，可以從時(shí)間類型變量中提取該時(shí)間變量的年、月、日、星期幾、時(shí)、分和秒。需要注意的是getMonth()的返回結(jié)果是0-11，所以需要加1。而getDay()的返回結(jié)果是0-6，其中0代表星期日，所以我們建立一個(gè)數(shù)組weeks，其內(nèi)部元素從星期日開(kāi)始，這樣返回結(jié)果就正好可以作為去數(shù)組中尋找對(duì)應(yīng)值的序號(hào)。getTimezoneOffset()是返回時(shí)間類型變量與格林威治標(biāo)準(zhǔn)時(shí)間的分鐘差，將返回結(jié)果除60即可轉(zhuǎn)換成小時(shí)單位，添加在國(guó)際時(shí)UTC后即可正確表示當(dāng)?shù)貢r(shí)區(qū)。

最后就是把各個(gè)變量用加號(hào)拼接起來(lái)，賦值給返回參數(shù)即可，這里的拼接方法與數(shù)據(jù)綁定中都是一樣的。

2.組件

demo中從上到下分別是待轉(zhuǎn)化時(shí)間行，在案例的前臺(tái)添加了事件初始化時(shí)會(huì)填入當(dāng)前時(shí)間，也可以自行輸入；第二行是轉(zhuǎn)換格式的選項(xiàng)行，這里使用了一個(gè)下拉菜單，在菜單組件中用for容器循環(huán)創(chuàng)建選項(xiàng)，作為數(shù)據(jù)來(lái)源的二維數(shù)組已經(jīng)輸入了各個(gè)選項(xiàng)的名稱和標(biāo)準(zhǔn)格式；第三行負(fù)責(zé)展示各個(gè)轉(zhuǎn)換格式的標(biāo)準(zhǔn)樣式；最后一行則是轉(zhuǎn)換結(jié)果。

3.事件

當(dāng)我們?cè)诓藛沃羞x擇選項(xiàng)后會(huì)根據(jù)選項(xiàng)的值做一個(gè)條件判斷，執(zhí)行對(duì)應(yīng)的自定義函數(shù)，然后從自定義函數(shù)的回調(diào)中獲取到函數(shù)的運(yùn)算結(jié)果，賦值給對(duì)應(yīng)的文本組件。

另外，當(dāng)我們通過(guò)輸入更改需轉(zhuǎn)化的值的內(nèi)容時(shí)，也會(huì)執(zhí)行一樣的動(dòng)作。

4.系統(tǒng)時(shí)間

當(dāng)然，ivx中其實(shí)也提供了關(guān)于時(shí)間的一些功能，選擇應(yīng)用系統(tǒng)的時(shí)間選項(xiàng)，也可以獲取到當(dāng)前時(shí)間的具體信息，前臺(tái)初始化事件中就用到了這一功能。

另外在變量中也有一個(gè)時(shí)間變量，我們可以對(duì)其進(jìn)行賦值或者獲取該時(shí)間變量的相關(guān)信息。