一、过滤器
基本使用: 在插值语法中加 | 比如:{{message | capi}}
过滤器函数,必须定义到filters节点之下 过滤器本质是函数 过滤器中的形参,永远都是“管道符”前面的那个值
私有过滤器
在filters节点下的都是私有过滤器 只能在当前绑定的vue实例下使用
filters:{
capi(val){
//val = data中的数据
return 'abc'
}
全局过滤器
Vue.filter()独立于每个实例之外
这个方法又两个参数
第一个参数,是全局过滤器的名字
第二个参数,是全局过滤器的处理函数.
示例:
Vue.filter('capi',function(val){
let first = val.charAt(0).toUpperCase();
let other = val.slice(1)
return first + other
})
需要定义在实例化vue对象的上面。
消除渲染时的过渡
当页面刷新的时候data中的数据还没有渲染出来,页面中就会显示原本写的插值语法,这时候就需要消除这个bug
在绑定的实例化对象的元素上上添加v-cloak 并在style样式中添加(只要前面加上v-都可以实现,随意命名,通常使用clock)
[v-cloak]{
display: none;
}
二、自定义指令