zoukankan      html  css  js  c++  java
  • ant design vue 日期选择器只选择年份

    https://antdv.com/docs/vue/introduce-cn/

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    <a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
                <a-form-model-item label="年度/季度" >
                    <a-date-picker
                    mode="year"
                    placeholder="请选择年份"
                    format='YYYY'
                    v-model="form.yearQuarter" 
                    style="100%"
                    :open='yearShowOne' 
                    @openChange="openChangeOne"
                    @panelChange="panelChangeOne"/>
                </a-form-model-item>
    </a-form-model>

      

    年度打开关闭状态,true为打开,false为关闭

    yearShowOnefalse

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    methods: {
         // 弹出日历和关闭日历的回调
          openChangeOne(status) {
                if (status){
                    this.yearShowOne =  true
                }
            },
         // 得到年份选择器的值
         panelChangeOne(value) {
                this.form.yearQuarter = value;
                this.yearShowOne = false;
            }
    }

         <a-date-picker
                      mode="year"
                      placeholder="请选择年份"
                      format='YYYY'
                      v-model="searchForm.year"
                      style="100%"
                      :open='yearShowOne'
                      @openChange="openChangeOne"
                      @panelChange="panelChangeOne"/>
                      
                      yearShowOne: false,
                      
                      
                      openChangeOne(status) {
          if (status){
            this.yearShowOne =  true
          }
        },
        // 得到年份选择器的值
        panelChangeOne(value) {
          let aa = value.toString();
          this.searchForm.year= aa.substring(11,15);
          this.yearShowOne = false;
        }

  • 相关阅读:
    Android 监听键盘弹出/隐藏
    js 监听事件的叠加和移除
    如何用 Swift 语言构建一个自定控件
    适用于Web开发人员的20个CSS调色板
    学习Flutter应用开发有用的代码/库/专有技术列表
    学习Java的书籍资料
    可能对Flutter应用程序开发有用的代码/库/专有技术列表
    ios 动画:底部标签栏的概念设计
    iOS 开发者必不可少的 75 个工具
    创建Android Apps的30个经验教训
  • 原文地址:https://www.cnblogs.com/csjoz/p/15392404.html
Copyright © 2011-2022 走看看