AntDesign年度日期选择框

项目中我们各种日期选择都会用到，这里介绍项目中使用Antdesign-vue框架的日期选择框遇到的问题

官方示例控件中没有年度选择的示例，这里总结了网上的网友提到的一些api，做出来的效果，发下效果图

官方文档提供了一个mode属性控制时间类型，但是mode设置为YYYY后，你会发现面板无法操作，官方对此也做了介绍

原因这里也说明了，然后说说我的实现过程

这里用到了一个变量isopen控制面板开关，三个事件函数openmodel、updateTime、clearTime，分别是面板开关函数，以及面板日期更改函数，清除日期时间函数

// 打开时间面板
openmodel(status) {
  if (status) {
    this.isopen = true;
  } else {
    this.isopen = false;
  }
},
// 更改时间面板
updateTime(val) {
  this.form.setFieldsValue({
     "year": val
  })
  this.isopen = false;
},
// 清除时间
clearTime() {
  this.form.setFieldsValue({
     "year": null
  })
},

,当然官方也说了，计划在[email protected]中加入示例组件，如果你等不及的话，可以在自己的项目中对antdesign框架的组件进行二次封装,这也是一个对当下最好的方式。