VUE2 x之過濾器的基本用法

2022-09-28 06:18:12 字數 494 閱讀 2926

vue.js 允許你自定義過濾器,可被用於一些常見的文字格式化。過濾器可以用在兩個地方:雙花括號插值和v-bind表示式。過濾器應該被新增在 j**ascript 表示式的尾部,由「 | 」符號指示:

過濾器存在全域性定義和區域性定義兩種方式:

1、區域性定義是在vue例項的filter屬性中定義函式,它也只能在該vue例項中使用

/**

過濾器函式總接收表示式的值 (之前的操作鏈的結果) 作為第乙個引數。下面例子中過濾器toupper函式將會收到 msg 表示式的值

作為第乙個引數。

*/let data =

data,

filters:

}})

2、全域性定義是在建立vue例項之前呼叫vue.filter方法,可以被全部vue例項使用

vue.filter('

toupper

', function(msg) )

VUE2 X過濾器的使用方法

vue2.x過濾器的使用方法有幾種,今天講一種,以cnode社群api為示例,轉換tab型別為中文漢字。首先我們在assets資料夾中新建個js的資料夾,並新建common.js,然後將過濾器寫在這個檔案中。當然你也可以寫在單個元件中,這個等下後面說。將tab型別轉換成漢字 param tab 待轉...

Vue之過濾器filter

在官方文件中,是這樣說明的 可被用於一些常見的文字格式化,vue中過濾器的作用可被用於一些常見的文字格式化。也就是修飾文字,但是文字內容不會改變 過濾器分兩種 全域性過濾器 區域性過濾器 全域性過濾器使用頻率還是非常高的。兩個小例子 1 給金額前加 符號,2 裝置狀態用文字展示。用三種方式分別來實現...

vue 過濾器基本用法以及封裝過濾器

理解 不改變data的資料格式,在介面顯示處理後的資料格式 比如 對陣列中的日期進行擷取 整體 封裝過濾器filter如下 在vue cli腳手架裡面的src檔案下面的components中建立乙個filter.js檔案 然後在filter裡面寫入過濾器方法 過濾器 function formats...