在vuetify的数据表中更改日期格式

Question

有没有一种方法可以使用momentjs更改VueJS数据表中的日期格式？

因为现在我不能像这样使用它：moment（“ STRT_D”）。format（“ MMMM DD YYYY”）

import moment from "moment";
export default {
  data() {
    return {
      singleSelect: false,
      selected: [],
      results: [],
      headers: [
        {
          text: "Start Date",
          sortable: false,
          value: "STRT_D"
        },
        {
          text: "Expiry Date",
          sortable: false,
          value: "LAST_D"
        },
        {
          text: "Print Date",
          sortable: false,
          value: "PrintDate"
        }
      ]
    };
  },

这是我现在的桌子

Answer 1

您可以自定义行模板

<template>
  <v-data-table
    :headers="headers"
    :items="results"
    class="elevation-1"
  >
    <template v-slot:item.STRT_D="{ item }">
      {{ formatDate(item.STRT_D) }}
    </template>
  </v-data-table>
</template>

我在这里用一种方法设置日期格式，您可以改为创建Vue过滤器

methods: {
  formatDate(value) {
      return moment(value).format("MMMM DD YYYY")
  }
}