過濾器分全局過濾器和局部過濾器
<div id="app">
<p>電腦價格：{{price | addPriceIcon}}</p>
</div>
<script>
let vm = new Vue({
el:"#app",
data:{
price:200
},
filters:{
//處理函數
addPriceIcon(value){
console.log(value)//200
return '¥' + value
}
}
})
上邊代碼，
我的需求是想把價格前面加上人民币符号（¥），
模闆中文本後邊需要添加管道符号（ | ）作為分隔，管道符 | 後邊是文本的處理函數，
處理函數的第一個參數是：管道符前邊的——文本内容，(注意)
如果處理函數上邊傳遞參數，則從第二個參數依次往後是傳遞的參數。(注意)
可能有人會問：你手動加上去不就得了！如果頁面有上千個價格需要添加，
怎麼辦？幾十個頁面需要添加怎麼辦呢，手動加能累暈！是以這種通用機制很重要。
全局過濾器
<div id="app">
<h3>{{viewContent | addNamePrefix}}</h3>
</div>
<script>
Vue.filter("addNamePrefix",(value)=>{
return "my name is" + value
})
let vm = new Vue({
el:"#app",
data:{
viewContent:"呂星辰"
}
})
上邊代碼，全局過濾器，
參數一：是過濾器的名字，也就是管道符後邊的處理函數；
參數二：處理函數，處理函數的參數同上。。。
參考位址：https://blog.csdn.net/qq_42778001/article/details/95613371
作者：明月人倚樓
出處：https://www.cnblogs.com/IwishIcould/
想問問題，打賞了卑微的部落客，求求你備注一下的扣扣或者微信；這樣我好聯系你；(っ•̀ω•́)っ✎⁾⁾！
如果覺得這篇文章對你有小小的幫助的話，記得在右下角點個“推薦”哦，或者關注部落客，在此感謝！
萬水千山總是情，打賞5毛買辣條行不行，是以如果你心情還比較高興，也是可以掃碼打賞部落客(っ•̀ω•́)っ✎⁾⁾！
支付寶
微信
本文版權歸作者所有，歡迎轉載，未經作者同意須保留此段聲明，在文章頁面明顯位置給出原文連接配接
如果文中有什麼錯誤，歡迎指出。以免更多的人被誤導。