【antdv】a-range-picker月份范围、年度mode=“year“选择后弹框不关闭

前情提要：antdv版本 1.7.8

一、月份范围选择

 直接上代码吧

<template>
  <a-col :span="6">
   <a-form-model-item label="结算月" prop="settleMonth">
     <a-range-picker
        format="YYYY-MM"
        valueFormat="YYYY-MM"
        v-model="formState.settleMonth"
        :mode="['month', 'month']"
        :open="monthPickShow"
        @panelChange="handlePanelChange"
        @openChange="handleOpenChange"
     />
    </a-form-model-item>
  </a-col>
</template>
<script>
export default {
    data() {
        return {
            monthPickShow: false,
            formState: {
                settleMonth:[]
            },
        }

    methods: {
        handlePanelChange(value) {
            if (this.formState.settleMonth[1] && this.formState.settleMonth[1]._d != value[1]._d) {
                this.monthPickShow = false;
            }
            console.log(value)
            this.formState.settleMonth = value;
            this.formState.settleMonthFrom = moment(value[0]).format('YYYY-MM')
            this.formState.settleMonthTo = moment(value[1]).format('YYYY-MM')
        },
        handleOpenChange(status) {
            if(status){
                this.monthPickShow = true;
            }else{
                this.monthPickShow = false
            }
        },
    }
}
</script>

二、年度选择

直接上代码：

<a-date-picker
    format="YYYY"
    mode="year"
    placeholder="请选择"
    :value="form.planYear"
    v-model="form.planYear"
    :open="open"
    ref="yearUI"
    @openChange="openChange"
    @panelChange="panelChange"
    style="width: 100%"
/>

export default {
  data() {
    return {
        open: false,
    }
  }

  methods: {
    openChange(status) {
      if (status) {
        this.open = true;
      } else {
        this.open = false;
      }
    },
    panelChange(value) {
      this.$set(this.form, "planYear", value);
      this.open = false;
    },

  }
}

以上。