vue Calendar组件设置点击的日期格式

在Vue.js中，如果你想要控制Calendar组件中点击日期的显示格式，通常需要结合`v-on:click`事件处理程序以及日期格式化的库，如`moment.js`、`date-fns`或者Vue自身的内置API。

假设你正在使用像vue-calendly这样的第三方插件，你可以这样做：

<template>
  <calendar v-model="selectedDate" @click-day="formatSelectedDate"></calendar>
</template>

<script>
import { Calendar } from 'vue-calendly';

export default {
  components: {
    Calendar,
  },
  data() {
    return {
      selectedDate: null,
    };
  },
  methods: {
    formatSelectedDate(date) {
      // 使用 moment.js 或者 date-fns 格式化日期
      const formattedDate = moment(date).format('YYYY-MM-DD'); // 如果使用 moment.js
      // 或者 const formattedDate = new Date(date).toLocaleDateString(); // 如果使用 JavaScript 内置方法

      this.selectedDate = formattedDate;
    },
  },
};
</script>

在这个例子中，当用户点击日历上的日期，`formatSelectedDate`方法会被触发，它会将日期转换为你所选择的格式（这里举例为'YYYY-MM-DD'格式）并存储到`selectedDate`数据属性中。