vue定義私有過濾器和基本使用
阿新 • • 發佈:2021-11-22
私有過濾器和全域性過濾器的方法和概念都相同,只是一個是全域性都可以呼叫,而私有的只有自己可以呼叫,全域性過濾器點這裡全域性過濾器 使用方法也和全域性過濾器一致,只是定義的地方不同 全域性過濾器是在
script
中 通過.filter
定義
私有過濾器定義方法:
<script> let vm = new Vue({ el:'#app',data:{ },filters: { // 當前例項私有的過濾器 } }) </script>
vm
實列中,有和 data
同級的 filters
,用來定義當前例項的私有過濾器
<div id="app"> IdZYPxj <p>{{mes | addStr}}</p> </div> <script src=".//vue.js"></script> <script> let vm = new Vue({ el:'#app',data:{ mes:"我是一個悲觀的人,悲觀的人做悲觀的事"輸出結果為: 如果頁面中 有第二個例項,},filters: { // 當前例項私有的過濾器 addStr(data,str="開心"){ return data.replace(/悲觀/g,str) } } }) </script>
vm2
,去調用 vm
中的過濾器,是呼叫不到的
如果在頁面上有一個全域性過濾器,和私有過濾器,是可以同時呼叫的
<div id="app"> <p>{{mes | setStr | addStr}}</p> </div> <script src="./js/vue.js"></script> <script> Vue.filter('setStr',function(data){ return data+'我是全域性過濾器' }) let vm = new Vue輸出結果: 總結: 在呼叫時我們在前面呼叫的 全域性 ,後面是私有 但輸出結果卻是 私有過濾器先進行處理 所以,當同時呼叫全域性和私有過濾器時,呼叫規則是誰離的近先輸出誰, 先私有在全域性({ www.cppcns.com el:'#app',data:{ mes:"我是一個悲觀的人,悲觀的人做悲觀的事" },str) } } }) </script>
到此這篇關於 vue定義私有過濾器和基本使用的文章就介紹到這了,更多相關 vue定義私有過濾器內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!