vue el-date-picker 选择多个月份

Vue.js 的 Element UI 组件库中的 el-date-picker 组件默认不支持选择多个月份的功能。如果需要实现这个需求，可以通过自定义方法来实现。

以下是一个简单的示例，展示如何使用 el-date-picker 组件来选择一个时间范围，并且在选择结束后获取这个时间范围内的所有月份：

<template>
  <el-date-picker
    v-model="range"
    type="daterange"
    range-separator="至"
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    @change="handleDateChange"
  >
  </el-date-picker>
  <div v-if="selectedMonths.length">
    选择的月份：
    <ul>
      <li v-for="month in selectedMonths" :key="month">{{ month }}</li>
    </ul>
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      range: [],
      selectedMonths: []
    };
  },
  methods: {
    handleDateChange(value) {
      if (this.range.length === 2) {
        const start = new Date(this.range[0]);
        const end = new Date(this.range[1]);
        this.selectedMonths = this.getAllMonthsBetween(start, end);
      }
    },
    getAllMonthsBetween(start, end) {
      let current = new Date(start);
      const months = [];
      while (current <= end) {
        const month = `${current.getFullYear()}-${current.getMonth() + 1}`;
        months.push(month);
        current.setMonth(current.getMonth() + 1);
      }
      return months;
    }
  }
};
</script>

在这个示例中，我们使用了 el-date-picker 的 daterange 类型来选择一个日期范围。当用户选择了开始和结束日期后，handleDateChange 方法会被触发，并计算出两个日期之间的所有月份，然后将这些月份保存到 selectedMonths 数组中，以便在模板中显示。