vuetable表格中的时间戳转换日期格式
时间: 2023-09-01 18:08:49 浏览: 339
时间戳格式转换
在 `vuetable` 中,我们也可以使用过滤器来将时间戳转换为日期格式。首先,我们需要在 `data()` 中定义一个过滤器对象:
```javascript
data() {
return {
tableOptions: {
// ...
dateFilters: {
dateFormat(value) {
if (!value) return ''
const date = new Date(value * 1000)
return date.toLocaleDateString()
}
}
}
}
}
```
然后,在表格配置中使用这个过滤器:
```html
<vuetable
:api-url="'/api/data'"
:fields="fields"
:sort-order="sortOrder"
:table-options="tableOptions"
>
</vuetable>
```
在 `fields` 中,我们需要将时间戳字段与过滤器绑定:
```javascript
fields: [
{
name: 'timestamp',
title: '日期',
sortField: 'timestamp',
formatter: (value, row) => {
return row['timestamp']
},
dateField: true,
dateInputFormat: 'YYYY-MM-DD',
dateOutputFormat: 'X',
dateFilter: 'dateFormat'
},
// ...
]
```
这样,我们就可以将时间戳转换为日期格式并在 `vuetable` 中显示了。需要注意的是,过滤器对象中的 `dateFormat` 必须与 `dateFilter` 中的名称一致。
阅读全文