过滤器

自定义过滤器

        Vue.filter('过滤器名称', function(value) {
            // 业务逻辑
        });   

　过滤器的使用

<div>{{msg | upper}}</div>
<div>{{msg | upper | lower}}</div>
<div :abc="msg | upper">测试</div>    

　局部过滤器

    var vm = new Vue({
            el: '#app',
            data: {
                msg: ''
            },
            filters: {
                upper: function(val) {
                    return val.charAt(0).toUpperCase() + val.slice(1);
                },
                lower: function(val) {
                    return val.charAt(0).toLowerCase() + val.slice(1);
                }
            }
        })

　　带参数的过滤器

    <div id="app">
        <div>{{date | format('yyyy-mm-dd')}}</div>
    </div>
    <script src="../js/vue.js"></script>
    <script>
        Vue.filter('format', function(val, arg) {
            if (arg == 'yyyy-mm-dd') {
                var rel = '';
                rel += val.getFullYear() + '-' + (val.getMonth() + 1) + '-' + val.getDate();
                return rel;
            }
        });
        var vm = new Vue({
            el: '#app',
            data: {
                date: new Date()
            }
        })
    </script>