Vue过滤器Filter的使用

过滤器的作用:
他是可以从中取得你想要的,给哪个数据添加装饰,比如在一个价格前面给他一个¥的符号,把’Hello’变成’Hello World’,可以使用filter在后面添加World,或者把时间节点改成时间戳等.

过滤器可以在new vue实例注册全局的,也可以在组件中注册局部的

用法一:

全局过滤器:

Vuefilter(''globalFilter,function(value){
   return value + '$';
})

局部注册:

filters:{
  componentFilter:function(value){
  return value + '¥';
}
}

注意:全局注册时后面不需要添加s的,局部注册就需要加S的,虽然没有报错的,但是过滤器是没有效果的

用法二:
1.在双花括号插值

{
   
   { 'hi ' | Filter }}

2.在v-bind中使用

<div v-bind:data="'ok'|filter"></div>

猜你喜欢

转载自blog.csdn.net/weixin_43465609/article/details/108783670
今日推荐