如何格式化Vuetify数据表日期列? [英] How to format Vuetify data table date column?
本文介绍了如何格式化Vuetify数据表日期列?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个使用 Vuetify 数据表的简单数据表.列之一是createdOn
(日期时间),我想对其进行格式化.我该怎么办?
I have a simple data table using Vuetify data table. One of the column is a createdOn
(date time), I want to format it. How can I do it ?
这就是我现在得到的:
<template>
<v-layout>
<v-data-table :headers="headers" :items="logs">
</v-data-table>
<v-layout>
</template>
<script>
headers: [
{ text: "Time", value: "createdOn", dataType: "Date" },
{ text: "Event Source", value: "eventSourceName" },
{ text: "Event Details", value: "eventDetails" },
{ text: "User", value: "user" }
],
items: [],
</script>
推荐答案
您应使用 custom row cell
:
<v-data-table :headers="headers" :items="logs">
<template v-slot:item.createdOn="{ item }">
<span>{{ new Date(item.createdOn).toLocaleString() }}</span>
</template>
</v-data-table>
这篇关于如何格式化Vuetify数据表日期列?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文