平武建站

怎么在Vue中自定义使用过滤器-创新互联

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

创新互联于2013年开始，先为上街等服务建站，上街等地企业，进行企业商务咨询服务。为上街企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

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中自定义使用过滤器有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联网站建设公司行业资讯频道，感谢大家的支持。

另外有需要云服务器可以了解下创新互联建站www.cdcxhl.com，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。


当前名称：怎么在Vue中自定义使用过滤器-创新互联
文章出自：http://pwwzsj.com/article/cdgdpp.html

其他资讯