vue只保留小数点后两位

作者：System 时间：2024年08月07日分类：所有,vue.js 字数：547

这篇文章距离上次修改已过204天，其中的内容可能已经有所变动。

在Vue中，你可以使用过滤器来格式化数字，只保留小数点后两位。

首先，定义一个全局过滤器来处理数字的格式化：




Vue.filter('twoDecimals', function (value) {
  if (typeof value !== 'number') {
    return value;
  }
  return value.toFixed(2);
});

然后，在模板中使用这个过滤器：




<div>{{ price | twoDecimals }}</div>

在组件的方法中，如果你需要在JavaScript代码中处理数字，也可以直接调用过滤器：




methods: {
  formatPrice(value) {
    return this.$options.filters.twoDecimals(value);
  }
}

使用方法：




<div>{{ formatPrice(price) }}</div>

以上代码展示了如何在Vue中创建和使用过滤器来格式化数字。