vue.js实现价格格式化的方法


Posted in Javascript onMay 23, 2017

这里分享一个常用的价格格式化的一个方法,在电商的价格处理中非常的实用,我们可以看一个效果

vue.js实现价格格式化的方法

这里在价格数据的地方使用了一个过滤器,通过这个过滤器对价格做了保留小数位的处理。

HTML

<div class="price">
 <span v-html="goods.sale_price|format"></span>
 <span class="price-before">¥{{"这里是价格数据"}}</span>
</div>

JS

filters:{  //数据过滤器
 format:function(value){
  var html,_val;
  value =Number(value).toFixed(2);
  if(value==0){
   value=0;
   return html = "¥<span>0</span>";
  }else if(value.split('.')[1].substring(1)==0){
   value = Number(value).toFixed(1);
  }
  _val = value.split('.');
  return html = '¥<span>'+_val[0]+'</span><em>.'+_val[1]+'</em>';
 }
}

以上所述是小编给大家介绍的vue.js实现价格格式化的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
基于JQuery的数字改变的动画效果--可用来做计数器
Aug 11 Javascript
JavaScript 判断日期格式是否正确的实现代码
Jul 04 Javascript
JS 实现导航栏悬停效果(续)
Sep 24 Javascript
JS判断两个时间大小的示例代码
Jan 28 Javascript
jQuery无缝轮播图代码
Dec 22 Javascript
javaScript生成支持中文带logo的二维码(jquery.qrcode.js)
Jan 03 Javascript
微信小程序开发图片拖拽实例详解
May 05 Javascript
浅谈vue的props,data,computed变化对组件更新的影响
Jan 16 Javascript
Angular 4.x+Ionic3踩坑之Ionic3.x pop反向传值详解
Mar 13 Javascript
vue富文本框(插入文本、图片、视频)的使用及问题小结
Aug 17 Javascript
JavaScript前端页面搜索功能案例【基于jQuery】
Jul 10 jQuery
使用react+redux实现计数器功能及遇到问题
Jun 02 Javascript
js编写选项卡效果
May 23 #Javascript
jQuery日期范围选择器附源码下载
May 23 #jQuery
详解JavaScript数组过滤相同元素的5种方法
May 23 #Javascript
强大的 Angular 表单验证功能详细介绍
May 23 #Javascript
微信小程序 侧滑删除(左滑删除)
May 23 #Javascript
最常用的jQuery表单验证(简单)
May 23 #jQuery
jquery实现简单实用的轮播器
May 23 #jQuery
You might like
PHP安装攻略:常见问题解答(一)
2006/10/09 PHP
CI框架给视图添加动态数据
2014/12/01 PHP
使用php的HTTP请求的库Requests实现美女图片墙
2015/02/22 PHP
php设计模式之观察者模式实例详解【星际争霸游戏案例】
2020/03/30 PHP
javascript 冒号 使用说明
2009/06/06 Javascript
jquery提示 &quot;object expected&quot;的解决方法
2009/12/13 Javascript
jQuery简单实现网页选项卡特效
2014/11/24 Javascript
JQuery操作元素的css样式
2015/03/09 Javascript
自制微信公众号一键排版工具
2016/09/22 Javascript
javascript中setAttribute兼容性用法分析
2016/12/12 Javascript
js实现炫酷的左右轮播图
2017/01/18 Javascript
基于Vue实现可以拖拽的树形表格实例详解
2018/10/18 Javascript
实现Vue的markdown文档可以在线运行的方法示例
2018/12/11 Javascript
vue点击页面空白处实现保存功能
2019/11/06 Javascript
javascript利用键盘控制小方块的移动
2020/04/20 Javascript
JS XMLHttpRequest原理与使用方法深入详解
2020/04/30 Javascript
vue添加锚点,实现滚动页面时锚点添加相应的class操作
2020/08/10 Javascript
[55:42]VG vs VGJ.T 2018国际邀请赛淘汰赛BO1 8.21
2018/08/22 DOTA
Python下rrdtool模块的基本使用方法
2015/11/13 Python
linux下python使用sendmail发送邮件
2018/05/22 Python
python+mysql实现学生信息查询系统
2019/02/21 Python
Opencv实现抠图背景图替换功能
2019/05/21 Python
python opencv捕获摄像头并显示内容的实现
2019/07/11 Python
新手学python应该下哪个版本
2020/06/11 Python
浅谈python锁与死锁问题
2020/08/14 Python
PyCharm 2020.1版安装破解注册码永久激活(激活到2089年)
2020/09/24 Python
新闻专业本科生的自我评价分享
2013/11/20 职场文书
简历的自荐信
2013/12/19 职场文书
医务人员自我评价
2014/01/26 职场文书
农村葬礼主持词
2014/03/31 职场文书
个人校本研修方案
2014/05/26 职场文书
团队队名口号大全
2014/06/06 职场文书
法定代表人授权委托书范文
2014/08/02 职场文书
2015年公共机构节能宣传周活动总结
2015/03/26 职场文书
客户经理岗位职责大全
2015/04/09 职场文书
2019西餐厅创业计划书范文!
2019/07/12 职场文书