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 相关文章推荐
document对象execCommand的command参数介绍
Aug 01 Javascript
javascript编程起步(第三课)
Feb 27 Javascript
Js 获取当前日期时间及其它操作实现代码
Mar 04 Javascript
使用javascript:将其它类型值转换成布尔类型值的解决方法详解
May 07 Javascript
jquery和js实现对div的隐藏和显示方法
Sep 26 Javascript
jQuery实现图片向左向右切换效果的简单实例
May 18 Javascript
很棒的js选项卡切换效果
Jul 15 Javascript
Angular.js中angular-ui-router的简单实践
Jul 18 Javascript
图片加载完成再执行事件的实例
Nov 16 Javascript
Vue组件库发布到npm详解
Feb 17 Javascript
红黑树的插入详解及Javascript实现方法示例
Mar 26 Javascript
this.$toast() 了解一下?
Apr 18 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使用Smarty的相关注意事项及访问变量的几种方式
2011/12/08 PHP
PHP扩展Swoole实现实时异步任务队列示例
2019/04/13 PHP
客户端脚本中常常出现的一些问题和调试技巧
2007/01/09 Javascript
jQuery写的日历(包括日历的样式及功能)
2013/04/23 Javascript
利用js实现前台动态添加文本框,后台获取文本框内容(示例代码)
2013/11/25 Javascript
JS判断文本框内容改变事件的简单实例
2014/03/07 Javascript
js使用DOM操作实现简单留言板的方法
2015/04/10 Javascript
在JS中操作时间之getUTCMilliseconds()方法的使用
2015/06/10 Javascript
基于Node.js的强大爬虫 能直接发布抓取的文章哦
2016/01/10 Javascript
js老生常谈之this,constructor ,prototype全面解析
2016/04/05 Javascript
JS实现数组去重复值的方法示例
2017/02/18 Javascript
详解Node.js 命令行程序开发教程
2017/06/07 Javascript
js排序与重组的实例讲解
2017/08/28 Javascript
arcgis for js栅格图层叠加(Raster Layer)问题
2017/11/22 Javascript
vue-cli 3.0 自定义vue.config.js文件,多页构建的方法
2018/09/19 Javascript
微信小程序中使用echarts的实现方法
2019/04/24 Javascript
微信小程序 子级页面返回父级并把子级参数带回父级实现方法
2019/08/22 Javascript
layUI使用layer.open,在content打开数据表格,获取值并返回的方法
2019/09/26 Javascript
Django在Win7下的安装及创建项目hello word简明教程
2014/07/14 Python
python中迭代器(iterator)用法实例分析
2015/04/29 Python
Python中关于Sequence切片的下标问题详解
2017/06/15 Python
python操作gitlab API过程解析
2019/12/27 Python
python实现手势识别的示例(入门)
2020/04/15 Python
python logging.info在终端没输出的解决
2020/05/12 Python
Django ORM实现按天获取数据去重求和例子
2020/05/18 Python
在keras中model.fit_generator()和model.fit()的区别说明
2020/06/17 Python
python 合并多个excel中同名的sheet
2021/01/22 Python
基于CSS3 animation动画属性实现轮播图效果
2017/09/12 HTML / CSS
英国著名音像制品和图书游戏购物网站:Zavvi
2016/08/04 全球购物
美国帽子俱乐部商店:Hat Club
2019/07/05 全球购物
俄罗斯有趣和原创礼物网上商店:MagicMag
2019/08/01 全球购物
简述索引存取方法的作用和建立索引的原则
2013/03/26 面试题
大二学生学习个人自我评价
2014/01/19 职场文书
环境工程专业自荐信范文
2014/06/24 职场文书
PostgreSQL存储过程实用脚本(二):创建函数入门
2021/04/05 PostgreSQL
Python 实现定积分与二重定积分的操作
2021/05/26 Python