vue2.0里,不再有自带的过滤器,需要自己定义过滤器。定义的方法如下:
注册一个自定义过滤器,它接收两个参数:过滤器 ID 和过滤器函数。
Vue.filter('filtername',function(value,参数){ return 参数+value.split('').reverse().join(''); });1234123
完整代码如下:
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style> </style> </head> <script src='./vue2.js'></script> <script> window.onload=function(){ //类似于自定义指令,可以用全局方法 Vue.filter() 注册一个自定义过滤器,它接收两个参数:过滤器 ID 和过滤器函数。 Vue.filter('reverseString',function(value,myString){ // function里第一个参数value默认为使用这个过滤器的data值,在本例中是msg的值'you are mine'。请注意:第一个参数必须为自身的值,后面可以加任意多的参数 return myString+value.split('').reverse().join(''); }); new Vue({ el:'#box', data:{ msg:'you are mine' } }); }; </script> <body> <div id='box'> <p>msg is: <br>{{msg}}</p> <hr> <p>reverse msg is: <br>{{msg|reverseString( 'Hello:' )}}</p> <!-- 在vue2.0里 过滤器只能用类似函数的写法reverseString( 'I must tell you:'),括号内是参数,不同于vue1.0的用空格后加参数的写法" msg|reverseString 'I must tell you:' " --> </div> </body> </html> 12345678910111213141516171819202122232425262728293031323334353637383940411234567891011121314151617181920212223242526272829303132333435363738394041
输出结果为:
msg is: you are mine reverse msg is: Hello:enim era uoy
以上所述是小编给大家介绍的vue2中filter()的实现代码,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:notice#nhooo.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。