elementui calendar

ElementUI 中的日历组件是一个非常实用的组件，它提供了多种日历视图，包括月视图、周视图和日视图等，同时还支持设置多个日期范围、禁用指定日期等功能。

以下是一个简单的示例代码，展示了如何在 Vue.js 中使用 ElementUI 的日历组件：

<template>
  <div>
    <el-calendar v-model="date" :range="range" :disabled-date="disabledDate"></el-calendar>
  </div>
</template>

<script>
export default {
  data() {
    return {
      date: new Date(),
      range: [new Date(2022, 0, 1), new Date(2022, 11, 31)],
    };
  },

  methods: {
    disabledDate(time) {
      // 禁用 2022 年 1 月 1 日至 3 月 31 日之间的所有日期
      return time.getTime() < new Date(2022, 0, 1).getTime() || time.getTime() > new Date(2022, 2, 31).getTime();
    },
  },
};
</script>

在上面的代码中，我们使用了 `el-calendar` 组件，并将它的 `v-model` 绑定到 `date` 变量上，以便获取用户选择的日期。同时，我们还设置了 `range` 属性，用于限制可选日期的范围；并且定义了一个 `disabledDate` 方法，用于禁用指定日期。

更多关于 ElementUI 日历组件的用法和配置，可以参考官方文档：https://element.eleme.cn/#/zh-CN/component/calendar。