Ant design Vue a-date-picker實現年份選擇


https://www.antdv.com/docs/vue/faq-cn/

 

代碼實現:

當前需要對組件a-date-picker進行改造,如下:
html:
 

<a-date-picker
mode="year"
format="YYYY"
:value="state.time"
:open="state.isopen"
placeholder="請選擇年份"
@focus="changeopen"
@panelChange="handlePanelChange1">
</a-date-picker>


JS:
 
JavaScript
handlePanelChange1(value, mode) {
this.mode1 = mode
console.log(value);
console.log(mode);
this.state.time = value
this.state.isopen = false
},
changeopen() {
this.state.isopen = true;
}

效果:

bbecb9da-d3db-4547-8dbe-71e211d5647d.png
主要通過 focus 實現該日期框的打開和關閉, 使用panelChange 獲取當前選擇的年份。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM