vuejs过滤器

复制代码
结合管道符 |

{{messageOne | capitalize}}    capitalize  首字母大写

{{messageOne | uppercase}}    uppercase  大写字母 

{{messageTwo | currency '¥' 0}} currency  货币联合符 后面的0 是说小数点后面显示几个0 写3就跟着三个0

{{messageThree}} {{messageThree | pluralize "one" "two" "three" "four"}}  
pluralize  返回数组中结构的一部分 构造器根据数字来寻值 下表是从1开始

<input v-model="messageFour" debounce="1000" /> 
 debounce  之前是管道符 现在vue2.0作为一盒属性来使用,作用是可以防止反复的刷新
现在是一秒同步一次(延迟数据双向绑定),默认是200毫秒

filter自定义过滤器
Vue.filter('my-f',{
         read:function(value){
            return "¥"+value
         },
         write:function(value){
            return parseInt(value)
         }
});


<li v-for="intem of intems |filterBy xianshi | limitBy 10 "message"  "tmp" ">{{intem.message}}</li> 
               tmp 是方便查找的标签更大化  你比如你输入作者他写的书很多,就可以通过这样找他的书
               <li v-for="intem of intems|orderBy 'message' -1">
                             {{intem.message}}
               </li> 
orderBy  "字面量" 排序

<li v-for="intem of intems | limitBy 10 3">{{intem.message}}</li>
limitBy管道符 后面跟着的数就是显示的个数 第二个数字是从这个数字开始往下显示第一个数字的个数
复制代码

 

posted @   xuanPhoto  阅读(284)  评论(0编辑  收藏  举报
编辑推荐:
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· 什么是nginx的强缓存和协商缓存
· 一文读懂知识蒸馏
· Manus爆火,是硬核还是营销?
点击右上角即可分享
微信分享提示