189 8069 5689

怎么在Vue中自定义使用过滤器

今天就跟大家聊聊有关怎么在Vue中自定义使用过滤器，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

网站建设哪家好，找创新互联！专注于网页设计、网站建设、微信开发、微信小程序开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了寿阳免费建站欢迎大家使用！

1、过滤器的用法,用  ‘|' 分割表达式和过滤器。

例如：{{ msg |  filter}}     {{msg | filter(a)}}  a就标识filter的一个参数。

用两个过滤器：{{msg | myfilter | myfilternumber }}

2、自定义的过滤器

过滤器的结构为：Vue.filter("id",function(value,a){});

value是过滤器的一个参数，也是默认的原始值。a是自定义的一个参数。

自定义过滤器的例子：





  
  
  
  



  
    
    msg的值：{{msg}},其中a的个数： {{msg | myfilter('a')}}
    

    
    msg的值：{{msg}},其中b的个数： {{msg | myfilter | myfilternumber}}

  
  Vue.filter("myfilter", function(value, arg) {     //返回一个对象或者json字符串，列出字符串中的字符以及字符的个数,不区分大小写     var obj = {};     var s = value.split('').sort().join("");     var reg = /(.)\1+/ig;     var str = s.replace(reg, "$1"); //字符串去重后的结果     var i = 0,       n,       a;     while (s.length > 0) {       a = str.charAt(i);       n = s.lastIndexOf(a) + 1;       obj[a] = n;       s = s.substring(n);       i++;     }     return arg ? obj[arg] : obj;   });   Vue.filter("myfilternumber", function(value) {     return value.b;   });   var app1 = new Vue({     el: "#app",     data: {       msg: "a1a1aba2babac"     },     methods: {     }   });

看完上述内容，你们对怎么在Vue中自定义使用过滤器有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联行业资讯频道，感谢大家的支持。


标题名称：怎么在Vue中自定义使用过滤器
URL地址：http://cdxtjz.cn/article/ppoehi.html

其他资讯