詳解Vue2 0裡過濾器容易踩到的坑

vue2.0裡，不再有自帶的過濾器，需要自己定義過濾器。定義的方法如下：

註冊乙個自定義過濾器，它接收兩個引數：過濾器 id 和過濾器函式。

vue.filter('filtername',function(value,引數));

function裡程式設計客棧第乙個引數value預設為使用這個過濾器的data物件內的值，在本例中是msg的值'you are mine'。

坑1：第乙個引數必須為自身的值，後面可以加任意多的引數。數序顛倒就會出錯。

下面來乙個最常見的小例子來說明在使用vue2.0過濾器並結合v-text時遇到的其他的幾個坑：

需求：在頁面輸出一段反轉順序的字串。

完整**如下：

document

msg is: }

revers程式設計客棧e msg is: }

輸出結果為：

msg is:

you are mine

reverse msg is:

hello:enim era uoy

坑2：在vue2.0裡 過濾器只能用類似函式的寫法reversestrin 『i must tell you:')，括號內是引數，不同於vue1.0的用空格後加引數的寫法；

坑3：v-text裡用過濾器失效，原因是在vue2.0裡 管道符『|'只能用在mousetache和v-bind中。

以上只是乙個簡單的過濾器的用法，如果涉及到複雜的資料處理的過濾器，比如實現vue1.0裡用到過濾器套過濾器的功能，個人感覺也可以用computed來代替過濾器。希望對大家的學習有所幫助，也希望大家多多支援我們。

本文標題: 詳解vue2.0裡過濾器容易踩到的坑

本文位址:

Vue2 0裡過濾器容易踩到的坑

vue2.0裡，不再有自帶的過濾器，需要自己定義過濾器。定義的方法如下 註冊乙個自定義過濾器，它接收兩個引數 過濾器 id 和過濾器函式。vue.filter filtername function value,引數 function裡第乙個引數value預設為使用這個過濾器的data物件內的值，在...

vue2 0中過濾器的使用

vue.js在2.0版本中，相對於1.0版本做了比較大的改動，2.0版本中，過濾器只用於插入文字中 1.0版本中指令 如 v for,v on等 裡邊的過濾器現在都放在計算屬性中。同時1.0版本中的所有內建過濾器 如 capitalize等 全部取消了。下邊通過乙個實際的例子說明2.0版本中過濾器的...

Vue2 0自定義過濾器

先了解一下什麼是vue過濾器 vue在1.0中有許許多多的各種功能的過濾器 先建立乙個例項裡面寫上一些資料稍後使用 var vm new vue methods dom 結構中 幾個1.0中自帶的過濾器例子 limitby 迴圈陣列的時候顯示幾條資料,從那條 索引 開始顯示 filterby在所有的...