vxe-table千分位和保留两位小数
时间: 2023-12-14 19:33:03 浏览: 390
保留两位小数
以下是使用vxe-table插件实现千分位和保留两位小数的方法:
1. 在表格列的formatter属性中使用vxe-utils库的formatNumber函数实现千分位和保留两位小数的格式化:
```javascript
{
title: '金额',
key: 'amount',
formatter: ({ cellValue }) => VXETable.formats.formatNumber(cellValue, { useGrouping: true, minimumFractionDigits: 2 })
}
```
2. 在表格列的editRender属性中使用vxe-utils库的formatNumber函数实现编辑时的千分位和保留两位小数的格式化:
```javascript
{
title: '金额',
key: 'amount',
editRender: {
name: 'input',
renderEdit: ({ row, column }) => {
const num = row[column.property].toString().split('.')
return [
<input
type="text"
value={num[0].replace(/\D/g, '').replace(/\B(?=(\d{3})+(?!\d))/g, ',') + (num[1] ? '.' + num[1] : '')}
onInput={e => {
const val = e.target.value.replace(/\D/g, '').replace(/\B(?=(\d{3})+(?!\d))/g, ',')
row[column.property] = val ? parseFloat(val.replace(/,/g, '')) : null
}}
/>
]
}
}
}
```
阅读全文