vue el-table表格中的时间戳转换日期格式
时间: 2023-11-11 11:31:52 浏览: 285
详解vue2.0的Element UI的表格table列时间戳格式化
5星 · 资源好评率100%
在 `element-ui` 的 `el-table` 中,我们可以使用自定义列格式化函数来将时间戳转换为日期格式。首先,我们需要在表格列配置中定义一个格式化函数:
```javascript
columns: [
{
label: '日期',
prop: 'timestamp',
formatter: (row, column) => {
if (!row[column.property]) return ''
const date = new Date(row[column.property] * 1000)
return date.toLocaleDateString()
}
},
// ...
]
```
在这个格式化函数中,我们将时间戳乘以 1000 转换为毫秒值,并使用 `toLocaleDateString()` 方法将其转换为日期格式。然后,在 `el-table` 中使用这个列配置:
```html
<el-table :data="tableData" :columns="columns"></el-table>
```
这样,我们就可以将时间戳转换为日期格式并在 `el-table` 中显示了。需要注意的是,时间戳字段必须与列配置中的 `prop` 属性一致。
阅读全文