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

2021-09-29 10:37:49 字數 2751 閱讀 4020

過濾器中必須有返回值

一般使用花括號}插值,管道符前是要過濾的元素,管道符之後是過濾方法

}<

/p>

過濾方法中有乙個引數,這個引數就是傳進來的要過濾的元素

// 過濾器

filters:

}

使用過濾器時出現死迴圈

因為在將原陣列排序後賦值給原陣列,引用空間沒有變化,過濾一直在執行

解決辦法:

使用擴充套件符將陣列賦值給新的變數,並且引用空間發生了改變,不會再迴圈

// 過濾器

filters:

}

有參過濾

根據文字框的內容篩選符合條件的內容顯示

5.v-for裡不能直接寫管道符|過濾,可以將過濾條件新增在方法或者計算屬性中

方法

forsort()

寫在計算屬性中呼叫時不加執行()

for=

"(item,index) in forsort"

:key=

"index"

>

}<

/p>

寫在方法中時加()執行方法

for=

"(item,index) in forsort()"

:key=

"index"

>

}<

/p>

全域性過濾器
以上定義的過濾器均為區域性過濾器,只能在當前元件使用

src目錄下新建乙個filters資料夾,在filter目錄下建立乙個filter.js檔案

這裡舉乙個陣列排序從大到小的例子

看**:

過程中因為名稱問題報錯,更改後成功

let

arrsort

=function

(value)

}export

在入口檔案(main.js)中引入這個filter檔案 (路徑以你自己的為準)

import

*as filter from

'./filters/filter'

在入口檔案中全域性註冊filter

這個暫時沒有查到講解!!

//過濾器統一處理載入

object.

keys

(filters)

.foreach

(key =>

)

在元件中使用

}<

/p>

頁面顯示:

[6,

5,4,

3,2,

1]

知識點補充;

一、import…asimport:匯入乙個模組;注:相當於匯入的是乙個資料夾,是個相對路徑

import a as b:給予工具庫 a 乙個簡單的別稱 b ,可以幫助記憶。

二、from…import from…import:匯入了乙個模組中的乙個函式;注:相當於匯入的是乙個資料夾中的檔案,是個絕對路徑。

例:如from a import b,相當於

1 import a

2 b = a.b

三、結論當引用檔案時:import //模組.函式,匯入模組,每次使用模組中的函式都要是定是哪個模組。

from…import

//直接使用函式名使用就可以了

from…import

*// 是把乙個模組中所有函式都匯入進來;

注:相當於:相當於匯入的是乙個資料夾中所有檔案,所有函式都是絕對路徑。

自定義過濾器

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

Vue 過濾器案例(全域性過濾器和區域性過濾器)

doctype html en utf 8 viewport content width device width,initial scale 1.0 js vue 2.4.0 js script 過濾器 title head 兩個過濾器的名稱都為msgformat,但是控制不同作用,乙個是全域性的...

python檔案路徑過濾器 自定義過濾器及標籤

布局 自定義的 放在 再到ttemplateags 資料夾下建立python模組 py檔案 2,定義復用 1,自定義模板過濾器 模板過濾器是什麼 函式,乙個或兩個引數 第乙個引數,是傳遞進來的模板變數 第二個引數,普通的引數,也可以是預設,也可以不要 其實就是個函式,沒有什麼不同 定義非常簡單,就是...