萌框架vue(四) 過濾器

2021-09-02 23:04:20 字數 836 閱讀 5875

作用:一些常見的文字格式化

用途:① 用插值表示式之中

② 用在 v-bind 之中

分類:① 全域性過濾器

② 區域性過濾器

全域性過濾器:

1)建立乙個過濾器物件(一定在放在 vue 例項之前)

vue.filter(filtername, function(value){})

filtername: 定義過濾器的名稱

function(el) {} : 將來過濾器要執行的邏輯

value: 使用過濾器的資料

2)實現過濾器的邏輯,這個邏輯一定要有返回值

3)使用過濾器: '管道』符號

定義在 vue 例項之中

通過 filters 屬性中的鍵值對來建立的

① 在 vue 例項中新增乙個屬性 filters

② 在 filters 屬性中新增乙個過濾器(布局過濾器)

鍵值對: 鍵:過濾器的名字 值:過濾器的邏輯函式

③ 在過濾器的邏輯函式中完成邏輯**

④ 使用過濾器

① 全域性過濾器:

定義在 vue 例項之前

通過 vue.filter 來建立的

在任意 vue 例項中使用

② 區域性過濾器:

定義在 vue 例項之中

通過 filters 屬性中的鍵值對來建立的

只能在當前 vue 例項中使用

傳參:定義時的第乙個引數永遠是使用這個過濾器的資料

定義時的第二個引數是:呼叫時的第乙個引數

定義時的第三個引數是:呼叫時的第二個引數

串聯:多個過濾器可以串聯在一起使用

} -->

}

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,但是控制不同作用,乙個是全域性的...

vue學習 過濾器

作用 過濾資料,一般是把伺服器返回的資料,過濾成符合頁面展示的資料 1.私有過濾器 vue.component login data function filters 2.共有過濾器 最好把vue.filter放在元件註冊之前 vue.filter toup function input,name ...

vue中過濾器

常用語文字的格式化,過濾器可用在兩個地方 雙括號插值和v bind 表帶式 用符號 表示,在雙括號的中 在 v bind 中 具體使用請參考vue官方文件 如果專案中使用的過濾器比較多,不妨單獨用乙個filter.js檔案用來專門寫過濾器,在main.js中新增如下 就可以將filter中過濾器全部...