在vue中的html标签{{}}内可以调用函数方法
在vue中的html标签{{}}内可以调用函数方法
honey缘木鱼
发布于 2019-02-26 11:37:06
发布于 2019-02-26 11:37:06
今天领导提个需求，要求在金额上强制保留两位小数，本想着后台直接返回数据时，带着两位的小数，前端只是做个显示作用，后台说保留了小数但在传输过程中去掉了，可能他们做了格式转化。没办法了只能又是我们前端操作了，牵扯价钱的太多了，很多时候又有for 循环，怎么办呢？
思路：{{}}里面的是一个表达式，可不可以是个函数呢？经测试是可以的，具体实现方法如下：
- 写一个公共的强制保留两位小数的js方法
function toDecimal2 (x) {
var f = parseFloat(x)
if (isNaN(f)) {
return false
}
var f = Math.round(x * 100) / 100
var s = f.toString()
var rs = s.indexOf('.')
if (rs < 0) {
rs = s.length
s += '.'
}
while (s.length <= rs + 2) {
s += '0'
}
return s
}
export default {
toDecimal2
}在main.js中引用：
import newPrice from './config/api'引用：
<div class="price">¥{{newPrice(item.price)}}</div>效果：
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2019.01.25 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读