1.選擇日期后面板不會自動關閉
解決辦法:
比如選擇年組件,選中后彈窗不會自動關閉
<template>
<div>
<!-- 年選擇組件 -->
<a-date-picker
v-model="year"
mode="year"
:allowClear="false"
format="YYYY"
placeholder="請選擇年份"
:open="yearPickShow"
@panelChange="handlePanelChange"
@openChange="handleOpenChange"
/>
</div>
</template>
<script>
export default {
data() {
return {
year: "",
yearPickShow: false,
};
},
methods: {
handleOpenChange(status) {
this.yearPickShow = status;
},
handlePanelChange(value) {
this.year = value;
this.yearPickShow = false;
},
},
};
</script>
1.設置 DatePicker 的mode="year"屬性,可以實現按年的選擇
2.選擇完成之后,日期面板不會自動關閉,需要點擊一下才行,這樣的交與體驗不太好
3.借助:open="yearPickShow"控制日期面板的開關,借助@panelChange和@openChange完成選中后的關閉