其他分享
首页 > 其他分享> > vue——页面保留指定小数位数

vue——页面保留指定小数位数

作者:互联网

问题描述:自己计算出来的地块面积填挖方量等都保留了很多位小数,但希望页面上显示的数据保留两位数,而在逻辑交互中做比较判断要很多位小数。

实现途径:vue的过滤器 filters

代码:

<template>
  <div>
    <p>
      <label class="task-info-key" >面积:</label>
      <label class="task-info-value" style="width:220px">{{ selectedObj.SmArea / 100 | rounding }} m<sup>2</sup></label>
    </p>
    <p>
      <label class="task-info-key" >周长:</label>
      <label class="task-info-value" style="width:220px">{{ selectedObj.SmPerimeter / 100 | rounding }} m</label>
    </p>
  </div>
</template >
<script>
export default {
  data() {
    return {
      selectedObj: {
        id: 0,
        SmArea: 0,
        SmPerimeter: 0
      }
    };
  },
  filters: {
    rounding(value) {
      return value.toFixed(2)
    }
  },
  methods: {
        ...
  }
}
</script>

 

标签:vue,return,SmPerimeter,rounding,selectedObj,filters,SmArea,小数位,页面
来源: https://blog.csdn.net/qq_24641385/article/details/113524768