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 相关文章推荐
保证JavaScript和Asp、Php等后端程序间传值编码统一
Apr 17 Javascript
jquery select(列表)的操作(取值/赋值)
Aug 06 Javascript
浅谈Javascript鼠标和滚轮事件
Jun 27 Javascript
JQuery实现绚丽的横向下拉菜单
Dec 19 Javascript
jQuery如何实现点击页面获得当前点击元素的id或其他信息
Jan 09 Javascript
js的alert样式如何更改如背景颜色
Jan 22 Javascript
jQuery中appendTo()方法用法实例
Jan 08 Javascript
vue使用keep-alive实现数据缓存不刷新
Oct 21 Javascript
vue项目中axios使用详解
Feb 07 Javascript
vue.js的状态管理vuex中store的使用详解
Nov 08 Javascript
如何基于javascript实现贪吃蛇游戏
Feb 09 Javascript
vue cli3适配所有端方案的实现
Apr 13 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数组函数序列之rsort() - 对数组的元素值进行降序排序
2011/11/02 PHP
比较完整的微信开发php代码
2016/08/02 PHP
PHP微信模板消息操作示例
2017/06/29 PHP
使用composer 安装 laravel框架的方法图文详解
2019/08/02 PHP
图片按比例缩放函数
2006/06/26 Javascript
菜单效果
2006/10/14 Javascript
juqery 学习之三 选择器 层级 基本
2010/11/25 Javascript
jQuery easyui datagrid动态查询数据实例讲解
2013/02/26 Javascript
基于Vue.js实现简单搜索框
2020/03/26 Javascript
js实现消息滚动效果
2017/01/18 Javascript
详解利用Angular实现多团队模块化SPA开发框架
2017/11/27 Javascript
Bootstrap Table 搜索框和查询功能
2017/11/30 Javascript
使用vue中的v-for遍历二维数组的方法
2018/03/07 Javascript
Koa2微信公众号开发之本地开发调试环境搭建
2018/05/16 Javascript
JavaScript实现邮箱后缀提示功能的示例代码
2018/12/13 Javascript
jQuery实现文本显示一段时间后隐藏的方法分析
2019/06/20 jQuery
jQuery鼠标滑过横向时间轴样式(代码详解)
2019/11/01 jQuery
Openlayers3实现车辆轨迹回放功能
2020/09/29 Javascript
jQuery实现电梯导航模块
2020/12/22 jQuery
跟老齐学Python之从格式化表达式到方法
2014/09/28 Python
Python连接SQLServer2000的方法详解
2017/04/19 Python
python实现员工管理系统
2018/01/11 Python
python3.6下Numpy库下载与安装图文教程
2019/04/02 Python
Python爬虫实现验证码登录代码实例
2019/05/10 Python
Python基于模块Paramiko实现SSHv2协议
2020/04/28 Python
LocalStorage记住用户和密码功能
2017/07/24 HTML / CSS
通过canvas转换颜色为RGBA格式及性能问题的解决
2019/11/22 HTML / CSS
英国知名奢侈品包包品牌:Milli Millu
2016/12/22 全球购物
师范毕业生个人求职信
2013/12/09 职场文书
实习生自我鉴定
2013/12/12 职场文书
党的群众路线教育实践活动个人批评与自我批评
2014/10/16 职场文书
2014年社区党建工作总结
2014/11/11 职场文书
2015年中职班主任工作总结
2015/05/25 职场文书
2016会计专业自荐信范文
2016/01/28 职场文书
Angular性能优化之第三方组件和懒加载技术
2021/05/10 Javascript
SpringBoot使用ip2region获取地理位置信息的方法
2022/06/21 Java/Android