Vue自定义过滤器格式化数字三位加一逗号
- <template>
- <div class="index-compont">
- <div class="totalCount">{{num | NumFormat}}<span>元</span></div>
- </div>
- </template>
- <script>
- data(){
- return {
num: 876543.00- }
- },
- filters: {
- NumFormat: function (value) {
- if(!value) return '0.00'
- value = value.toFixed(2)
- var intPart = Math.trunc(value)// 获取整数部分
- var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
- var floatPart = '.00' // 预定义小数部分
- var value2Array = value.split('.')
- // =2表示数据有小数位
- if(value2Array.length === 2) {
- floatPart = value2Array[1].toString() // 拿到小数部分
- if(floatPart.length === 1) { // 补0,实际上用不着
- return intPartFormat + '.' + floatPart + '0'
- } else {
- return intPartFormat + '.' + floatPart
- }
- } else {
- return intPartFormat + floatPart
- }
- }
- }
- </script>
Vue自定义过滤器格式化数字三位加一逗号的更多相关文章
- vue 自定义过滤器 格式化金额(保留两位小数)
1.js部分 import Vue from 'vue' Vue.filter('money', function(val) { val = val.toString().replace(/\$|\, ...
- Vue自定义过滤器
gitHub地址: https://github.com/lily1010/vue_learn/tree/master/lesson05 一 自定义过滤器(注册在Vue全局) 注意事项: (1)全局方 ...
- vue 自定义过滤器
vue允许自定义过滤器,被用作一些常见文本的格式化.由“管道符”指示,格式如下: <!-- 在两个大括号中 --> {{message | capitalize}} <!-- 在 ...
- vue自定义过滤器的创建和使用
1.简单介绍 过滤器的作用:实现数据的筛选.过滤.格式化. 过滤器的本质是一个有参数,有返回值的方法. 过滤器可以用在两个地方:双花括号插值和v-bind表达式(后者从2.1.0+开始支持 ...
- Vue自定义指令实现下拉加载:v-loadmore
和methods平级: directives: { loadmore: {//自定义指令: 下拉加载 bind(el, binding) { var p = 0; var t = 0; ...
- vue自定义过滤器的创建与使用
原文地址 过滤器:生活中有很多例子,净水器 空气净化器 .过滤器的作用:实现数据的筛选.过滤.格式化. vue1.*版本是有内置的过滤器,但是在vue2.*所有的版本都已经没有自带的过滤器了. 1.过 ...
- 【转载】Vue自定义指令实现pc端加载更多
转载来源:https://www.86886.wang/detail/5a6f19e644f9da55274c3bbd,谢谢作者分享! 原理 document.documentElement.scro ...
- C# int转string 每三位加一个逗号
; Console.WriteLine(aaaa.ToString("N0")); Console.WriteLine()); Console.WriteLine("架构 ...
- js数字每3位加一个逗号
if(typeof val ==="number"){ var str = val.toString(); ? /(\d)(?=(\d{})+\.)/g : /(\d)(?=(?: ...
随机推荐
- antd 离线 icon
讲你下载下来的官方提供的字体库解压后所有文件复制到node-modules/antd/dist目录下 创建新的文件夹iconfont 在你项目生成的css入口文件对应的源码less文件开始添加如下两句 ...
- Binder IPC的权限控制
PS:个人理解:当进程1通过Binder调用组件2时,会将进程1的pid及uid赋给组件2,并检测进程1的pid及uid是否有权限调用组件2.而后组件2需要调用组件3,此时组件2保存的pid及uid为 ...
- hdu 4902 Nice boat--2014 Multi-University Training Contest 4
题目链接:http://acm.hdu.edu.cn/showproblem.php? pid=4902 Nice boat Time Limit: 30000/15000 MS (Java/Othe ...
- Sublime Text 3设置吊炸天PHP开发环境
@heiyeluren @created: 2016/5/31 @last modify: 2016/7/8 1. 下载安装Sublime Text 3 http://www.sublimetext. ...
- 错误 1 无法将程序集“NBear.Data.dll”复制到文件“D:\newbpm\bpm\SureBpm\Bin\NBear.Data.dll”。无法将“D:\newbpm\bpm\SureSoft.WebServiceBaseLib\bin\Debug\NBear.Data.dll”添加到网站。 无法添加文件“Bin\NBear.Data.dll”。 拒绝访问。 D:\..
错误 1 无法将程序集“NBear.Data.dll”复制到文件“D:\newbpm\bpm\SureBpm\Bin\NBear.Data.dll”.无法将“D:\newbpm\bpm\SureSof ...
- VS2010调用外部webservice
vs2010怎么调用web服务webservice方法,以vs2010为例.Vs的各个版本的此项功能操作基本一致. 工具/原料 vs2010 在“服务引用设置”对话框中,单击“添加 Web 引用”. ...
- 修改系统时间(取得服务器时间,使用SetLocalTime API函数,需要UAC权限)
我的客户遇到系统时间不对,自己又不会改,于是想到利用服务端时间来修改本地的系统时间. 第一步,把下面xml存成uac.xml文件备用. <?xml version="1.0" ...
- Being a Hero (hdu 3251 最小割 好题)
Being a Hero Time Limit: 20000/10000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) T ...
- bzoj1486【HNOI2009】最小圈
1486: [HNOI2009]最小圈 Time Limit: 10 Sec Memory Limit: 64 MB Submit: 1778 Solved: 827 [Submit][Statu ...
- SAP更改日志记录表
CDHDR 更改日志表头 CDPOS 更改日志行项目 SAP中修改频率较低的定制表(T001等)一般都会有修改记录存在,查看一个表有没有修改记录可以在SE11中查看他的技术设置,如果其中的LOG ...