el-input 显示成千分位
时间: 2023-08-28 12:04:07 浏览: 217
vue element-ui实现input输入框金额数字添加千分位
要将 el-input 显示成千分位,你可以使用 Vue.js 的过滤器来实现。首先,你需要在 Vue 实例中注册一个过滤器,然后在 el-input 中使用该过滤器。
在你的 Vue 实例中,注册一个名为 "thousandsSeparator" 的过滤器,可以这样写:
```javascript
Vue.filter('thousandsSeparator', function(value) {
// 将数字转换为字符串
let str = value.toString();
// 使用正则表达式在数字的千位之间插入逗号
return str.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
});
```
然后,在 el-input 中使用该过滤器,可以这样写:
```html
<el-input v-model="inputValue" :value="inputValue | thousandsSeparator"></el-input>
```
这样,当用户输入数字时,el-input 会自动将其显示为千分位的格式。
阅读全文