Vue的过滤器基本使用方法及其日常JS方法

every()与some()方法都是JS中数组的迭代方法。

  • every()是对数组中每一项运行给定函数,如果该函数对每一项返回true,则返回true。
  • some()是对数组中每一项运行给定函数,如果该函数对任一项返回true,则返回true。

 

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

注意: forEach() 对于空数组是不会执行回调函数的

eg:forEach(function)

 

item.name.indexOf(keywords) !=-1    (不等于-1为包含)

 

.filter(function)      <遍历每一个元素并返回成一个数组>

.includes()     <就是包含的意思>

return this.list.filter(item=>{

if(item.name.includes(keywords)){ //方法2

return item

}

})

 

过滤器的定义语法

Vue.filter(‘过滤器的名称’,function(){  })

 

过滤器只能用于插值表达式及其v-bind 里才能使用。

 

过滤器中的function,第一个参数是规定死的,永远都是过滤器管道符前面传递过来的数据

Vue.filter('过滤器名称',function(data){})

return data+'666'

})

调用过滤器:

<p>{{ 过滤对象 | 过滤器名称('') | 过滤器名称  }}</p>

(过滤器可以进行传参也多个过滤器同时使用,直接在后面加管道符即可)

 

<body>

<div id='app'>

<p>{{ mag | msgformat('')}}</p>

</div>

<script src='../lib/vue.js'> </script>

<script>

Vue.filter('msgformat',function(mag,arg){

return mag.replace(/过滤/g,arg)

})

var vm = new Vue({

el: '#app',

data: {

mag:'过滤器中的function,第一个参数是规定死的,永远都是过滤器管道符前面传递过来的数据'

},

methods: {

}

})

</script>

</body>

私有过滤器的使用:

     直接在控制器中直接添加新属性 filters:{    }  ,同样都是【过滤器名  和   处理函数】

eg:

filters: {

      newfilter:function(){

     }

}

在使用过滤器调用的时,采用的是就近原则,当全局过滤器名与私有过滤器名一致的时候,则优先调用私有过滤器。

 

 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值