el-input 显示成千分位

要将 el-input 显示成千分位，你可以使用 Vue.js 的过滤器来实现。首先，你需要在 Vue 实例中注册一个过滤器，然后在 el-input 中使用该过滤器。

在你的 Vue 实例中，注册一个名为 "thousandsSeparator" 的过滤器，可以这样写：

Vue.filter('thousandsSeparator', function(value) {
  // 将数字转换为字符串
  let str = value.toString();
  // 使用正则表达式在数字的千位之间插入逗号
  return str.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
});

然后，在 el-input 中使用该过滤器，可以这样写：

<el-input v-model="inputValue" :value="inputValue | thousandsSeparator"></el-input>

这样，当用户输入数字时，el-input 会自动将其显示为千分位的格式。

相关问题

el-input 千分位

el-input 是 Element UI 中的一个输入框组件，用于接收用户的输入。千分位是一种数字格式化的方式，即在数字中每隔三位加一个逗号，以提高数字的可读性。

在 el-input 中使用千分位格式化可以通过以下步骤实现：
1. 首先，需要在 el-input 组件中绑定一个值，例如使用 v-model 指令绑定一个数据属性。
2. 然后，在 el-input 组件上使用 @input 事件监听用户输入的变化。
3. 在事件处理函数中，可以使用 JavaScript 的内置函数 `toLocaleString()` 来将输入的数字进行千分位格式化。
4. 最后，将格式化后的值赋给绑定的数据属性，即可在 el-input 中显示千分位格式化后的数字。

下面是一个示例代码：

<template>
  <el-input v-model="inputValue" @input="formatInput"></el-input>
</template>

<script>
export default {
  data() {
    return {
      inputValue: ''
    };
  },
  methods: {
    formatInput() {
      // 将输入的数字进行千分位格式化
      this.inputValue = Number(this.inputValue).toLocaleString();
    }
  }
};
</script>

这样，当用户在 el-input 中输入数字时，会自动将输入的数字进行千分位格式化，并显示在 el-input 中。

el-input-number支持千分位吗

是的，Element UI 的 `el-input-number` 组件支持千分位显示，你可以使用 `formatter` 和 `parser` 属性来实现。

`formatter` 属性用于格式化显示值，可以自定义一个函数实现千分位分隔符的添加。例如：

<el-input-number v-model="num" :formatter="formatNum"></el-input-number>

export default {
  data() {
    return {
      num: 1234567.89
    }
  },
  methods: {
    formatNum(value) {
      return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
    }
  }
}

`parser` 属性用于解析用户输入的值，将其转换为合法的数字类型。例如：

<el-input-number v-model="num" :parser="parseNum"></el-input-number>

export default {
  data() {
    return {
      num: 0
    }
  },
  methods: {
    parseNum(value) {
      return parseFloat(value.replace(/,/g, ''))
    }
  }
}

在这个例子中，我们使用 `replace` 函数将用户输入的千分位分隔符去掉，然后使用 `parseFloat` 函数将其转换为浮点数类型。