vue框架过滤器定义与使用

代码块

 <div id="app">
        <input type="text" v-model="msg">
        <h3>{{msg | guolv}}</h3>
</div>

 Vue.filter('guolv', function(msg) {
            return msg + '1223';
        });
        var vm = new Vue({
            el: "#app",
            data: {
                msg: ''
            },
            methods: {

            },
            filters: { //定义私有过滤器 过滤器名称+处理函数

                guolv: function(msg) {
                    return msg + 225256
                }


            }
        })

总结
1、全局过滤器定义在最前面，最好在vue实例前，否则会报错。
2、全局过滤器使用{{msg | guolv}}，前面是数据，后面是过滤器名称。
3、可以加入参数，如：{{msg | guolv(‘shisui’)}}。
4、全局过滤器定义 Vue.filter(‘guolv’, function(msg,arr) { });函数第一个参数msg是需要使用的数据名称,后面的话可以有多个由过滤器传入的参数,如arr。
5、过滤器调用采用就近原则，优先使用私有过滤器。