Element UI 日期选择器（DatePicker） 如何监听月份切换？

每次遇到日期控件问题，都要上百度搜索，今天写个禁用月份案例，方便以后查看。（涉及父子组件传值）

子组件：

html部分：

<el-date-picker
v-if="item.type === 'DatePicker2'"
v-model="item.value"
type="month"
placeholder="月"
:picker-options="setMonthDisabled"

@change = "changeMonth"
/>

export default {
name: "",
components: {},
props: {

setMonthDisabled: {
disabledDate(time) {
// 获取当前的月份信息
const date = new Date(); // 获取当前的时间基本信息，值是这样的： Tue Jul 20 2021 14:59:43 GMT+0800 (中国标准时间)
const year = date.getFullYear(); // 获取当前年份，值是这样的： 2021
let month = date.getMonth() + 1; // 获取当前月份，值是这样的： 6 getMonth()方法返回值是0-11，也就是1月份到12月份，所以要加上1，才是当前月份
if (month >= 1 && month <= 9) {
// 如果是1月到9月就要在前面补上一个0 比如：02、07 月份这样表示
month = "0" + month;
}
const nowDate = year.toString() + month.toString(); // 转换成字符串拼接，最终得到年和月，比如此时的时间是2021年7月20号，所以nowDate的值是：202107

// 获取时间选择器的月份信息
const timeyear = time.getFullYear(); // 获取时间选择器的年份（有很多）
let timemonth = time.getMonth() + 1; // 与上面同理
if (timemonth >= 1 && timemonth <= 9) {
timemonth = "0" + timemonth;
}
const elTimeData = timeyear.toString() + timemonth.toString();

// 返回，时间选择器的日期月份大于当前日期的月份，又因为disabledDate函数是控制月份禁用不可选
// 所以，最终就是：时间选择器的月份大于当前的月份，就都禁用掉，所以就实现了最终效果：
// 大于等于当前月份都不可选
return elTimeData <= nowDate; // 这里虽然是字符串，但是弱类型语言js会做一个转换，是可以比较大小的如： '202107' > '202008'
},

},

data(){

return{}

},

methods:{

changeMonth(data){

this.$emit('changeMonth',data)

}

}

父组件：

<SearchTools
class="search-tools"
:search-obj="searchObj"
:setMonthDisabled="setMonthDisabled"
@changeMonth="changeMonth"

@changeMonth="changeMonths"
>
</SearchTools>

export default {
name: "assetLiability",
components: {},
data() {
return {

setMonthDisabled: {
disabledDate(time) {
// 获取当前的月份信息
const date = new Date();
const year = date.getFullYear();
let month = date.getMonth() + 1;
if (month >= 1 && month <= 9) {
month = "0" + month;
}
const nowDate = year.toString() + month.toString();
// 获取时间选择器的月份信息
const timeyear = time.getFullYear();
let timemonth = time.getMonth() + 1;
if (timemonth >= 1 && timemonth <= 9) {
timemonth = "0" + timemonth;
}
const elTimeData = timeyear.toString() + timemonth.toString();
// 大于等于当前月份都不可选
return elTimeData > nowDate;
},
},

}

},

methods:{

changeMonths

}

}