vue中过滤器的使用

用于一些常见的文本格式化

过滤器可以在不改变原始数据，只是对数据加工处理并且返回过滤后的数据，再进行调用处理

局部过滤器、全局过滤器

局部过滤器：

<template>

    <div class="hello">

        <ul>

            <li v-for="item in list" :key="item.id">

                    <span>名字：{{item.name}}</span>

                    <span>性别：{{item.sex | sexFilter}}</span>

            </li>

        </ul>

    </div>

</template>

<script>
    export default {
        name:"helloWorld",
        data() {
            return {
                list:[
                    {id:1,name:"张三",sex:0},
                    {id:2,name:"李四",sex:1},
                    {id:3,name:"王五",sex:1}
                ]
                }
            };
        },
        filters:{//过滤器
            sexFilter:function(value){
                if(value==0){
                    return '男'
                }else{
                    return '女'
                }
         }

}

</script>

全局过滤器：在main.js中

//vue.filter("过滤器"，"对应的过滤器函数")

vue.filter("sexFilter",function(value)){

if(value==0){ return '男' }else{ return '女' }

}