vue过滤器

过滤器
1，作用：把需要绚烂的数据进行二次或多次处理，既可以对请求进行拦截，也可以对响应进行处理。
2，过滤器的定义：
可以在一个组建的选项中定义本地过滤器：

//在组件中定义过滤器
filters: {
	capitalize:function(value) {}
	if(!value) return ""
	value = value.toString()
	return value.charAt.toUpperCase + value.silce(1)
	}
}

在vue实例之前全局定义过滤器过滤器：

全局定义下的过滤器
Vue.filter('capitalize',function(value) {
	if(!value) return ''
	value = value.toString()
	return value.charAt.toUpperCase + value.silce(1)
})
new Vue({
	//...
})

注：
当全局过滤器和局部过滤器重名时，会采用局部过滤器
过滤器中的方法没有挂载到实例上 this指向window
过滤器发法名字与methods中方法重名，不冲突

过滤器用法
1，双花括号插值

{{ message | capitalize}}

2，v-band 表达式（在2.1.0+ 开始支持）

<div v-band:id="rawId | formatid"></div>

   <template>
                <div>
                    <input type="text" v-model="filterCount">
                    <div class="filter">{{ filterCount | changeCapitalLetter }}</div>    
                </div>
            </template>
            <script>
                export default{
                    data(){
                        return{
                            filterCount:"hello"
                        }
                    },
                    filters:{
                        changeCapitalLetter(val){
                            if(!val) return ''
                            let newArr = val.toString().split(" ").map(ele=>{
                                return ele.CharAt(0).toUpperCase()+ele.slice(1)
                            })
                            return newArr.join(" ")
                    }
                }
            </script>