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 相关文章推荐
原生js实现半透明遮罩层效果具体代码
Jun 06 Javascript
ParseInt函数参数设置介绍
Jan 02 Javascript
js实现感应鼠标图片透明度变化的方法
Feb 20 Javascript
Javascript writable特性介绍
Feb 27 Javascript
基于BootStrap实现局部刷新分页实例代码
Aug 08 Javascript
基本DOM节点操作
Jan 17 Javascript
JS判断键盘是否按的回车键并触发指定按钮点击操作的方法
Feb 13 Javascript
JS实现最简单的冒泡排序算法
Feb 15 Javascript
Vue.js 单页面多路由区域操作的实例详解
Jul 17 Javascript
微信小程序wx.request实现后台数据交互功能分析
Nov 25 Javascript
使用Vue.js开发微信小程序开源框架mpvue解析
Mar 20 Javascript
vue两组件间值传递 $router.push实现方法
May 15 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
dedecms采集中可以过滤多行代码的正则表达式
2007/03/17 PHP
WordPress判断用户是否登录的代码
2011/03/17 PHP
利用ThinkPHP内置的ThinkAjax实现异步传输技术的实现方法
2011/12/19 PHP
thinkphp实现多语言功能(语言包)
2014/03/04 PHP
php下pdo的mysql事务处理用法实例
2014/12/27 PHP
编写PHP脚本使WordPress的主题支持Widget侧边栏
2015/12/14 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
做网页的一些技巧(续)
2007/02/01 Javascript
jQuery 扩展对input的一些操作方法
2009/10/30 Javascript
Javascript仿PHP $_GET获取URL中的参数
2014/05/12 Javascript
《JavaScript DOM 编程艺术》读书笔记之DOM基础
2015/01/09 Javascript
JavaScript给按钮绑定点击事件(onclick)的方法
2015/04/07 Javascript
Jquery EasyUI实现treegrid上显示checkbox并取选定值的方法
2016/04/29 Javascript
node.js express安装及示例网站搭建方法(分享)
2016/08/22 Javascript
浅谈ECMAScript6新特性之let、const
2017/08/02 Javascript
laydate 显示结束时间不小于开始时间的实例
2017/08/11 Javascript
微信小程序支付之c#后台实现方法
2017/10/19 Javascript
VUE脚手架的下载和配置步骤详解
2019/04/01 Javascript
使用xampp将angular项目运行在web服务器的教程
2019/09/16 Javascript
vscode调试node.js的实现方法
2020/03/22 Javascript
[02:21]DOTA2英雄基础教程 蝙蝠骑士
2013/12/16 DOTA
[40:50]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS LGD第四场
2014/05/24 DOTA
python获取外网ip地址的方法总结
2015/07/02 Python
python3下使用cv2.imwrite存储带有中文路径图片的方法
2018/05/10 Python
如何用Python合并lmdb文件
2018/07/02 Python
Python实现针对json中某个关键字段进行排序操作示例
2018/12/25 Python
Python 处理图片像素点的实例
2019/01/08 Python
在pycharm中使用git版本管理以及同步github的方法
2019/01/16 Python
python实现剪切功能
2019/01/23 Python
Python itertools.product方法代码实例
2020/03/27 Python
详解python使用金山词霸的翻译功能(调试工具断点的使用)
2021/01/07 Python
详解Html5原生拖拽操作
2018/01/12 HTML / CSS
唤醒头发毛囊的秘密武器:Grow Gorgeous
2016/08/28 全球购物
中国汽车租赁行业头部企业:一嗨租车
2019/05/16 全球购物
司仪主持词两篇
2014/03/22 职场文书
体育专业求职信
2014/07/16 职场文书