vue filter 過濾器使用

vue 自定義過濾器分爲"全局過濾器"和"局部過濾器"兩種。

一、 全局過濾器

1. 全局方法 Vue.filter() 註冊一個自定義過濾器，必須放在Vue實例化前面 ，否則不能被解析導致無法使用。
2. 過濾器表達式：過濾的內容 | 過濾器方法名
3. 過濾器方法中，可以設置過濾器參數，過濾的內容 | 過濾器方法名(參數1，參數2…)

 	<div id="app">
        <p>{{msg|msgFormat('瘋狂','你','不是')}}</p>
    </div>
    <script>
        Vue.filter('msgFormat',function(msg,arg,arg2){
            return msg.replace(/單純/g,arg).replace(/我/g,arg2)
        });
        var vm=new Vue({
            el:'#app',
            data:{
                msg:'曾經，我也是一個單純的少年，單純的我，傻傻的問，誰是世界上最單純的男人'
            },
            methods:{},            
        });      
    </script>

二、 局部過濾器

1. 局部過濾器需要在vue的示例中構建，且一個示例可有多個局部過濾器，因此使用filters，而全部過濾器只有一個，使用filter
2. 當全局和局部過濾器都存在時，真正作用的是局部過濾器，可以認爲就近原則。

	<div id="app">
        <p>{{msg|msgFormat('瘋狂','你','不是')}}</p>
    </div>
    <script>
        var vm=new Vue({
            el:'#app',
            data:{
                msg:'曾經，我也是一個單純的少年，單純的我，傻傻的問，誰是世界上最單純的男人'
            },
            methods:{},
            filters:{               
                msgFormat:function(msg,arg,arg2){
                    return msg.replace(/單純/g,arg).replace(/我/g,arg2);
                }
            }
        });      
    </script>