vue中filter的用法

2022-10-01 17:36:17 字數 679 閱讀 8830

平時開發中,需要用到過濾器的地方有很多,比如單位轉換、金額加千分位、文字格式化等,比如:

1

//格式化金額

2const digitsre = /(\d)(?=\d)/g

3 vue.filter('

currencyfilter

', function (value) )

實現效果16568686.00=> 16,568,686.00

這是常規用法,沒什麼好說的。下面來說一下在開發中遇到的乙個需要用到串聯過濾器的使用場景。

假設需要獲取乙個訂單處理狀態的列表,其中的每一項的 status 字段用來表示訂單狀態:

1

,6 status: 1 //

1 待支付 2 待發貨 3 待收貨

7 }

當我們拿到這個資料之後,v-for 的時候,肯定會這樣做:

123

}45626

這樣,表示狀態的 1, 2, 3 就變成了 待支付,待發貨,待收貨,這沒有什麼問題。但是,當需求來了,要求當狀態是待支付時,文字應該為紅色。

vue文件中有寫串聯過濾器的用法,針對這個問題可以很好的解決。

123

}45632

關於過濾器,這裡還有幾點要注意的:

vue中filter的使用

今天我們來學習一下filter的使用和在專案中的應用 此處我們在專案中使用filter來顯示多少月多少日,星期幾 在這裡我主要把他分為三步。第一步 此處建議使用乙個檔案來存放 因為你可能不只需要使用乙個過濾函式 第二步 在全域性main.js中引入此檔案,方便在所以檔案中使用 第三步就是在具體檔案中...

adotable中Filter的用法

當我們在運算元據集時,往往需要對資料進行篩眩例如 乙個名為customer的資料表,它具有custno custname country address phone state taxrate等字段,如果只想檢視國別為china或顧客號大於1000的顧客記錄,就需要對資料集進行過濾。經總結,有下面這...

js中filter的用法

filter也是乙個常用的操作,它用於把array的某些元素過濾掉,然後返回剩下的元素。和map 類似,array的filter 也接收乙個函式。和map 不同的是,filter 把傳入的函式依次作用於每個元素,然後根據返回值是true還是false決定保留還是丟棄該元素。例如,在乙個array中,...