<template>
<div class="consumption">
<p>{{payTime|Time}}</p>
<p class="orange">-{{amount|NumFormat}}元</p>>
</div>
</template> <script>
export default {
data() {
return {
payTime:‘--26T16::’,
amount:‘’
}
},
filters: {
// 时间格式的转换
Time(value) {
var dateee = new Date(value).toJSON();  
var date = new Date(+new Date(dateee)+**).toISOString().replace(/T/g,' ').replace(/\.[\d]{}Z/,'')
return date
},
// 金额显示.00格式
NumFormat: function (value) {
if(!value) return '0.00'
value = value.toFixed()
var intPart = Math.trunc(value)// 获取整数部分
var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{})+$)/g, '$1,') // 将整数部分逢三一断
var floatPart = '.00' // 预定义小数部分
var value2Array = value.split('.')
// =2表示数据有小数位
if(value2Array.length === ) {
floatPart = value2Array[].toString() // 拿到小数部分
if(floatPart.length === ) { // 补0,实际上用不着
return intPartFormat + '.' + floatPart + ''
} else {
return intPartFormat + '.' + floatPart
}
} else {
return intPartFormat + floatPart
}
}
}
}
</script>

注,该代码是在之前别人博客上面看到的 之前写项目的时候用到,原著现在我也不清楚

vue中的金额格式0.00 和 后台返回时间格式带T调整正常格式的更多相关文章

  1. 在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效??

    在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效?? 是因为swiper提前初始化了,那时候数据还没有完全出来.这里有两种解决办法 1. 使用vue提供的$nextTic ...

  2. 010——VUE中使用lodash库减少watch对后台请求的压力

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. (一)将mockjs集成到VUE中后,怎样根据接口入参返回mock结果

    1)安装mockjs,这一步跳过 2)在项目中建立mock模块,笔者的目录结构如下 mock模块与接口模块一一对应,有一个接口,就有一个mock 3)编写登陆模块mock接口,代码如下: import ...

  4. Echart中X轴为时间坐标刻度时,后台返回时间List被强制转化为时间戳问题

    if(recordlist!=null&&recordlist.size()>0) { for (Record record : recordlist) { //根据频次决定使用 ...

  5. vue中excel导入导出组件

    vue中导入导出excel,并根据后台返回类型进行判断,导入到数据库中 功能:实现js导入导出excel,并且对导入的excel进行展示,当excel标题名称和数据库的名称标题匹配时,则对应列导入的数 ...

  6. vue中使用stompjs实现mqtt消息推送通知

    最近在研究vue+webAPI进行前后端分离,在一些如前端定时循环请求后台接口判断状态等应用场景用使用mqtt进行主动的消息推送能够很大程度的减小服务端接口的压力,提高系统的效率,而且可以利用mqtt ...

  7. Vue中组件

    0828自我总结 Vue中组件 一.组件的构成 组件:由 template + css + js 三部分组成(.vue文件) 1)组件具有复用性 2) 复用组件时,数据要隔离 3) 复用组件时,方法不 ...

  8. vue表格中显示金额格式化与保存时格式化为数字并校验!

    最近项目中遇到了成本计算的,需要显示金额,保存一下,以后方便直接拿来用! 一 数字转金额格式显示 //数字转金额格式 format:function(s){ if(/[^0-9\.]/.test(s) ...

  9. cxGRID中的字段怎么能以0.00的格式显示

    CXGRID中的字段如何能以0.00的格式显示在CXGRID中如何让字段能以0.00的格式显示,我的字段是FLOAT类型,满意的马上给分! ------解决方案-------------------- ...

随机推荐

  1. 一直报找不到function,然后又不为null。最后发现是个数组。哭死。

    今天写代码,报找不到function.然后又不为空.最后发现是类型不对.因为是数组,所以不能用node.function(),而应该用nodeArr[0].function.错用前者会找不到funct ...

  2. 堆优化的dijkstra算法

    #include<bits/stdc++.h> using namespace std; #define ll long long #define P pair<int,int> ...

  3. 前端:将网站打造成单页面应用SPA

    前端:将网站打造成单页面应用SPA   前言 不知你有没有发现,像Github.百度.微博等这些大站,已经不再使用普通的a标签做跳转了.他们大多使用Ajax请求替代了a标签的默认跳转,然后使用HTML ...

  4. Gin_Cookie

    1. cookie HTTP是无状态协议,服务器不能记录浏览器的访问状态,也就是说服务器不能区分两次请求是否由同一个客户端发出 Cookie就是解决HTTP协议无状态的方案之一,中文是小甜饼的意思 C ...

  5. vue报错[Vue warn]: The data property "record" is already declared as a prop. Use prop default value instead.

    当我写了一个子组件,点击打开子组件那个方法时报了一个错 这句话说明意思呢?谷歌翻译一下↓ 数据属性“record”已声明为prop. 请改用prop默认值. 感觉翻译的有点怪,通过最后修改代码后大概意 ...

  6. BindingException: Invalid bound statement (not found)问题

  7. Vue+ESLint+Git钩子函数pre-commit配置教程

    一.创建Vue项目eslint-standard vue create eslint-standard 二.创建.eslintrc.* 删除package.json中的eslintConfig配置 我 ...

  8. JS高级---递归案例

    递归案例     递归案例: 求一个数字各个位数上的数字的和:  123   --->6 ---1+2+3 //递归案例:求一个数字各个位数上的数字的和: 123 --->6 ---1+2 ...

  9. TCP/IP详解,卷1:协议--第8章 Traceroute程序

    引言 由Van Jacobson编写的Tr a c e r o u t e程序是一个能更深入探索T C P / I P协议的方便可用的工具. 尽管不能保证从源端发往目的端的两份连续的 I P数据报具有 ...

  10. 使用TensorFlow训练模型的基本流程

    本文已在公众号机器视觉与算法建模发布,转载请联系我. 使用TensorFlow的基本流程 本篇文章将介绍使用tensorflow的训练模型的基本流程,包括制作读取TFRecord,训练和保存模型,读取 ...