过滤器
1.过滤器仅在2.0上适用,常用于插值表达式和v-bind属性绑定。
2.要定义到filter节点下,本质是一个函数。
3.在过滤器的形参中,就可以获取到“管道符”前面是待处理的那个值。
4.在过滤器中一定要有return值。
5.如果全局过滤器和私有过滤器名字一致,此时按照就近原则,最先调用的是私有过滤器。
<body>
<div id="app">
<p>message的值{{message|capi}}</p>
</div>
<div id="app2">
<p>message的值{{message|capi}}</p>
</div>
<script src="./vue-2.6.12.js"></script>
<script>
// 全局过滤器
Vue.filter('capi',function(str){
const first = str.charAt(0).toUpperCase();
const all = str.slice(1);
return first +all;
})
const app = new Vue({
el:"#app",
data:{
message:'hello Vue.js'
},
filters:{
capi(val){
const first = val.charAt(0).toUpperCase();
const all = val.slice(1);
return first+all;
}
}
})
const app2 = new Vue({
el:'#app2',
data:{
message:'hello Java'
}
})
</script>
</body>