這篇文章主要介紹filter如何全局使用,文中介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們一定要看完!

官方給出
Vue.filters(id , [definition])
//id {string}
//definition {function}詳情查看
在項(xiàng)目中我們?nèi)绻卸鄠€(gè)filters,那么我怎么一次注冊(cè),全局可用,我們?cè)陧?xiàng)目里新建一個(gè)filters文件夾,如下,index.js是出口文件,readMore是一個(gè)對(duì)字符串做處理的過(guò)濾器

文件目錄
下面貼上代碼:
//index.js
// 引入所有的過(guò)濾函數(shù)
import readMore from './readMore';
// 導(dǎo)出在一個(gè)對(duì)象上
export default {
readMore
};
//readMore.js
//查看更多文字顯示'...'
let readMore = (text,length,suffix) => {
if(text) {
if(text.length <= length) return text;
return text.substring(0,length) + suffix;
}
return text;
};
export default readMore;然后在main.js里面做如下處理:

main.js做全局注冊(cè)
//全局注冊(cè)自定義的過(guò)濾器
import filters from './filters';
for(let key in filters){
Vue.filter(key, (val,value1,value2) => {
return filters[key](val,value1,value2);
});
}就可以在全局使用了
//在test.vue里面使用
<p html="readMore('文字文字' ,60,`...<font style='color:rgba(25,123,207,1);'>全文</font>`)"></p>
<span>#<span class="add">{{'文字文字' | readMore(15,'...')}}</span>#</span>以上是“filter如何全局使用”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對(duì)大家有幫助,更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
分享題目:filter如何全局使用-創(chuàng)新互聯(lián)
網(wǎng)頁(yè)地址:http://chinadenli.net/article26/digejg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供全網(wǎng)營(yíng)銷(xiāo)推廣、App設(shè)計(jì)、品牌網(wǎng)站建設(shè)、微信小程序、定制開(kāi)發(fā)、商城網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容