date-picker月份范围

### 设置 `el-date-picker` 组件的月份选择范围

为了实现仅能选择特定范围内月份的功能，在 Element UI 中可以通过配置 `picker-options.disabledDate` 属性来控制不可选日期。对于限定只能选取某一年内的月份而言，可以在该属性对应的回调函数里判断所选日期是否处于目标年度内[^2]。

下面是一个具体的例子展示怎样通过 JavaScript 来定义只允许用户挑选指定年份里的各个月份：

<template>
  <div class="demo">
    <!-- 使用 month 类型并绑定 pickerOptions -->
    <el-date-picker 
      :picker-options="yearPickerOptions"
      type="month" 
      placeholder="选择月" 
      v-model="selectedMonth">
    </el-date-picker>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedMonth: '', // 存储选定的月份
      yearPickerOptions: { // 定义选项对象
        disabledDate(time) {
          const currentYearStart = new Date();
          currentYearStart.setFullYear(new Date().getFullYear());
          currentYearStart.setDate(1);
          currentYearStart.setHours(0, 0, 0, 0);

          const nextYearStart = new Date(currentYearStart);
          nextYearStart.setFullYear(nextYearStart.getFullYear() + 1);

          // 只有当时间位于今年年初到明年年初之间才可用
          return time.getTime() < currentYearStart.getTime() || time.getTime() >= nextYearStart.getTime();
        }
      }
    };
  },
};
</script>

此代码片段展示了如何利用 `disabledDate` 方法限制用户只能选择当前年的任意一个月作为有效输入。这里的关键在于计算出当年的第一天 (`currentYearStart`) 和下一年的第一天 (`nextYearStart`) ，以此为基础决定哪些日期应该被禁用。