vue类提供了一个方法叫filter,通过这个方法我们可以自定义插值过滤器,这个插值过滤器使用方法同内置的过滤器使用方法是一样的:
使用{{key | filterName param}} , 定义Vue.filter ( 过滤的名称, 过滤函数)
但是2.0中已经废弃了过滤器,需要我们自己定义
下面是自定义将输入命名转换成驼峰命名的小例子
<body>
<div id="demodemo">
<input type="text" v-model.lazy="msg"/>
<p>{{msg|toCamle}}</p>
</div>
<script src="js/vue.js"></script>
<script type="text/javascript">
需求:将输入内容做驼峰式命名的转化 abc-def=>abcDef
Vue.filter('toCamle',function(value){
return value.replace(/\-([a-zA-Z])/g,function(match,$1){
return $1.toUpperCase();
})
// 驼峰转小写
// Vue.filter('toCamle',function(value){
// return value.replace(/([A-Z])/g,function(match,$1){
// return '-'+ $1.toLowerCase();
// })
// 翻转
// return value.split('').reverse().join('')
})
new Vue({
el:'#demodemo',
data:{
msg:''
}
})
</script>
</body>