在vue ts中自定義過濾器(毫秒轉換成標準格式)

2021-09-17 20:32:24 字數 953 閱讀 7435

如果在許多地方都需要對資料格式進行轉換,那麼濾器絕對是一勞永逸的好方法。

1.就以時間為例,後台返回的多是毫秒數,所以就需要在前台將毫秒數轉換成標準時間格式

第一步,建立乙個timeutil.ts檔案,方便復用

/** 以毫秒1554780164000 轉換成 2019-04-09 11:22:44為例 */

// fmt: 'yyyy-mm-dd hh:mm:ss' time: new date(1554780164000)

export function formatdate(fmt: string, time: date) ;

if (/(y+)/.test(fmt))

for (const k in o)

}return fmt; // 2019-04-09 11:22:44

};

第二步,在需要用的地方引用timeutil.ts中的formatdate方法

第三步,寫過濾器

第四步,使用

2.以數量的多少調整單位為例

第一步,建立乙個單獨unitutil.ts檔案

export function formatunit(count: number) 

if (count > 10000 && count < 100000000) else if (count > 100000000) else

return result

};

第二部,引用

第三部,過濾器

第四步,使用

自定義過濾器

這裡的過濾器的作用主要是在業務邏輯裡面判斷,傳遞的引數是否有誤,然後在實現類裡面去判斷具體的業務資料,執行流程和servlet的過濾器相類似,但是執行時機和作用大不相同,servlet的執行時機是在請求資源,在達到control之前去執行,通過執行鏈,我們的這個過濾器是在control裡,如下.先定...

自定義過濾器和全域性過濾器

過濾器中必須有返回值 一般使用花括號 插值,管道符前是要過濾的元素,管道符之後是過濾方法 p 過濾方法中有乙個引數,這個引數就是傳進來的要過濾的元素 過濾器 filters 使用過濾器時出現死迴圈 因為在將原陣列排序後賦值給原陣列,引用空間沒有變化,過濾一直在執行 解決辦法 使用擴充套件符將陣列賦值...

自定義時間過濾器

實現步驟 第一步,引導入 datetime 第二步,引入乙個建立時間,或者 直接寫死乙個時間 第三步,註冊乙個時間過濾器 第四步,實現過濾器的 第五步,在模板中呼叫 示例 一 字典中的 create time datetime 2017,10,20,16,19,0 二 過濾器 def handel ...