antdv框架a-date-picker只选择年demo(整理)

简介: antdv框架a-date-picker只选择年demo(整理)

<template>
  <a-form-item label="考勤年份">
    <a-space direction="vertical">
      <a-date-picker mode="year" placeholder="请选择年份" format='YYYY' v-model="form.value1" style="100%" :open='yearShowOne' @openChange="openChangeOne" @panelChange="panelChangeOne" />
      </a-space>
  </a-form-item>
</template>
<script>
data() {
  return {
    form: {
      value1: ''
    },
    yearShowOne: false, //年度打开关闭状态,true为打开,false为关闭
  }
},
methods: {
  // 弹出日历和关闭日历的回调
  openChangeOne(status) {
    if (status) {
      this.yearShowOne = true
    }
  },
  // 得到年份选择器的值
  panelChangeOne(value) {
    this.form.value1 = value;
    this.yearShowOne = false;
  },
}
</script>
相关文章
|
1月前
|
小程序 API
uniapp中uview组件库丰富的Calendar 日历用法
uniapp中uview组件库丰富的Calendar 日历用法
305 0
|
9月前
|
小程序
uniapp-picker选择省市区效果demo(整理)
uniapp-picker选择省市区效果demo(整理)
uniapp picker实现选择年月demo效果(整理)
uniapp picker实现选择年月demo效果(整理)
|
1月前
|
移动开发 小程序 API
uniapp中uview组件库的丰富Upload 上传上午用法
uniapp中uview组件库的丰富Upload 上传上午用法
191 0
uniapp中picker只选择月和日demo效果(整理)
uniapp中picker只选择月和日demo效果(整理)
|
10月前
|
前端开发
前端项目实战柒拾壹react-admin+material ui-踩坑-List需要Datagrid中isRowExpandable设置写法
前端项目实战柒拾壹react-admin+material ui-踩坑-List需要Datagrid中isRowExpandable设置写法
48 0
|
10月前
|
前端开发
前端项目实战柒拾伍react-admin+material ui-踩坑-List需要Datagrid中rowEdit设置写法
前端项目实战柒拾伍react-admin+material ui-踩坑-List需要Datagrid中rowEdit设置写法
33 0
|
10月前
|
前端开发
前端项目实战柒拾肆react-admin+material ui-踩坑-List需要Datagrid中rowStyle设置写法
前端项目实战柒拾肆react-admin+material ui-踩坑-List需要Datagrid中rowStyle设置写法
90 0
|
10月前
|
前端开发
前端项目实战柒拾叁react-admin+material ui-踩坑-List需要Datagrid中optimized设置写法
前端项目实战柒拾叁react-admin+material ui-踩坑-List需要Datagrid中optimized设置写法
65 0
|
10月前
|
前端开发
前端项目实战伍拾捌react-admin+material ui-踩坑-List需要Datagrid中body写法
前端项目实战伍拾捌react-admin+material ui-踩坑-List需要Datagrid中body写法
55 0