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)(?=(?: ...
随机推荐
- android POI搜索,附近搜索,周边搜索定位介绍
POI搜索有三种方式.依据范围和检索词发起范围检索poiSearchInbounds.城市poi检索poiSearchInCity,周边检索poiSearchNearBy. 下以周边检索为例介绍怎样进 ...
- 基于UDP的通讯
XX:那飘过的100~_~{2014/10/03 10:57} UDP是一种面向非连接SOCK_DGRAM,提供无连接服务.数据包以独立包形式发送,不提供无措保证,数据能够丢失或反复. UDP的Ser ...
- iOS开发--常用技巧 (MJRefresh详解)
iOS开发--常用技巧 (MJRefresh详解) https://github.com/CoderMJLee/MJRefresh 下拉刷新01-默认 self.tableView.head ...
- 嵌入式开发之davinci--- 8148 中dsp在dsp_drv.c中的processdata()加算法出现下边缘条纹问题
(1)问题原因 dsp在alglink_priv.c中做灰度处理发现,下面出现条纹,后面发现是cache 缓存没及时写进内存问题 (2)解决办法 for(frameId=0; frameId<f ...
- Nginx——静态资源服务器(一)
java web的项目中,我们经常将项目部署到Tomcat或者jetty上,可以通过Tomcat或者jetty启动的服务来访问静态资源.但是随着Nginx的普及,用Nginx来作为静态资源服务器,似乎 ...
- RFC 在OA中创建PR
创建PR:BAPI_REQUISITION_CREATE BAPI_PR_CREATE "Create Enjoy Purchase Requisistion ...
- 常用的机器学习&数据挖掘知识点总结
Basis(基础): MSE(Mean Square Error 均方误差),LMS(LeastMean Square 最小均方),LSM(Least Square Methods 最小二乘法),ML ...
- Lightoj 1002 - Country Roads(prim算法)
I am going to my home. There are many cities and many bi-directional roads between them. The cities ...
- bzoj4594: [Shoi2015]零件组装机
论静态查错的重要性...乱搞题真难调 首先这题看起来就是要分治检验了. 考虑对于区间[l,r],分成[l,p-1]和[p,r]使得这两个区间合并可以得到[l,r],并且要保证后面一个区间较大 设前一个 ...
- YTU 2875: 倒霉蛋买饭去
2875: 倒霉蛋买饭去 时间限制: 1 Sec 内存限制: 128 MB 提交: 22 解决: 17 题目描述 早春星期天的某个早晨,大风呼呼地刮.一个宿舍n个人,谁也不想起床买饭去.他们定了一 ...