Vue2：过滤器

filter：过滤器

作用：

filter主要用于数据展示之前的处理

过滤器只能用在v-bind或者插值表达式中

 

语法：

{{shuxing|flt}}
{{shuxing|flt(arg2,arg3)}}
{{shuxing|flt(arg2,arg3)|flt2(el1,el2}}
//“shuxing”也是flt的一个参数

 

实例：

    <div id="box">
        <span v-for="el in arr">{{el.age|flt}}</span>
    </div>

    <script>
        new Vue({
            el: "#box",
            data: {
                arr:
                    [
                        {
                            age: 23
                        },
                        {
                            age: 22
                        },
                        {
                            age: 34
                        },
                        {
                            age: 13
                        }],

            },
            methods: {

            },
            filters: {
                flt(el) {
                    console.log(el);
                    if (el > 20) {
                        console.log("大人");
                    } else {
                        console.log("小孩");
                    }
                }
            }
        })
    </script>

 

 

 

注：fliter与methods、data同级，不是嵌套关系