ant design vue 3.x之前,年选择器没有,只能使用a-date-picker日期选择器,将mode设置成year,但是,只能看到效果,并不能实现选择,需要进行下面的改造:
<a-date-picker :value="year" mode="year" format="YYYY" :open="isopen" placeholder="选择年份" @change="onChange" @openChange="handYearChange" @panelChange="panelYearChange" />
data () { return { yearString: '', isopen:false, // 日历弹出的状态 year:null // moment格式 } } methods{ moment, // onchange只有在点击清除按钮时触发 onChange(){ this.year = null; this.yearString = '' }, handYearChange(open){ if(open){ this.isopen=true } else { this.isopen=false } }, panelYearChange(value){ this.year = value this.yearString = moment(value).format('YYYY') this.isopen = false } }