如何在 v-Calendar 中格式化日期？

Question

我正在尝试从 v-calendar 中获取正确的日期输出。现在看起来像：

Fri Jul 31 2020 00:00:00 GMT+0200 (utc summertime)

这应该是 2020-07-28 等等。我在文档中找不到任何有用的东西，有人知道如何更改输出吗？

代码：

{{ date }}

<v-date-picker
    v-model="date"
    color="red"
    is-inline
    :available-dates='dates'
    :masks='{ input:["L", "YYYY-MM-DD"] }'
/>

测试脚本：

<script>
    var app = new Vue({
        el: "#dic",
        data: {
            date: moment().format('YYYY-MM-DD'),
        },
    });
</script>

Answer 1

在date的基础上添加一个名为formattedDate的计算属性并使用它并保持data 属性 :

let app = new Vue({
  el: '#app',
  data: {
    date: moment().format('YYYY-MM-DD'),
  },

  computed: {
    formattedDate() {
      return moment(this.date).format('YYYY-MM-DD')
    }
  }
})

<script src='https://unpkg.com/vue/dist/vue.js'></script>

<script src='https://momentjs.com/downloads/moment.min.js'></script>
<script src='https://unpkg.com/v-calendar'></script>
<div id='app'>
  {{formattedDate }}

  <v-date-picker v-model="date" color="red" is-inline />
</div>

Answer 2

对于仍然感兴趣的任何人，2.0 引入了 model-config 道具，用于直接绑定到具有给定格式的字符串。

如何在 v-Calendar 中格式化日期？

How to format date in v-Calendar?

javascript

vue.js

vuejs2

vue-component

vcalendar