ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Ant design Vue a-date-picker实现年份选择

2021-09-16 15:06:22  阅读:206  来源: 互联网

标签:picker Vue isopen value Ant state 年份 mode


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 获取当前选择的年份。

标签:picker,Vue,isopen,value,Ant,state,年份,mode
来源: https://www.cnblogs.com/csjoz/p/15293460.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有