需求:

  时间选择器,只能选择 2000 年 - 至今的年份。

<el-date-picker
v-model="year"
type="year"
:picker-options="pickerOptions"
placeholder="年份"
format="yyyy 年"
value-format="yyyy"
@change="chooseYear">
</el-date-picker> js
new Vue({
  data: {
    year: '',
   pickerOptions: {
    disabledDate (time){
      return time.getFullYear() < '2000' || time.getFullYear() > new Date().getFullYear() // 注意是 || 不是 && 哦
    }
   }
  }
 
})

效果图:

ElementUI 之 DatePicker 日期限制范围 disabledDate的更多相关文章

  1. element-ui DatePicker 日期选择器 让结束日期大于开始日期

    element-ui  DatePicker 日期选择器 <el-date-picker v-model="addForm.startDate" type="dat ...

  2. element-ui DatePicker 日期格式处理

    1.使用DatePicker 日期选择器得到的日期格式是这样的 解决方案,添加 value-format="yyyy-MM-dd" <el-date-picker type= ...

  3. jQuery里面的datepicker日期控件默认是显示英文的,如何显示中文或其他语言呢?

    jQuery里面的datepicker日期控件默认是显示英文的,如何让他显示中文或其他呢? [官方的写法]: (1)引入JS文件: <script type="text/javascr ...

  4. 使用datepicker日期插件

    使用datepicker日期插件 在引入<jquery.js> <bootstrap.js><datepicker.js>之后 引用<bootstrap.cs ...

  5. DatePicker日期与时间控件

    DatePicker日期与时间控件 一.简介 二.方法 最日常的使用方法了 日期控件DatePicker 时间控件TimePicker 月份从0开始 三.代码实例 效果图: 代码: fry.Activ ...

  6. vue vue-cli3 修改elementui的date-picker源码 引入node_modules里的element-ui后报错exports is not defined

    报错说明: 1.复制node_modules/element-ui/packages/date-picker里的文件到自己项目里  --------->>>>>>& ...

  7. ElementUI datepicker日期选择器时间选择范围限制

    ElementUI是饿了么推出的一套基于vue2.x的一个ui框架.官方文档也很详细,这里做一个element-ui日期插件的补充. 最近做项目用到了datepicker,需要对日期选择做一些限制, ...

  8. ElementUI DatePicker 日期选择器控制选择时间范围

    选择今天以及今天之后的日期 <el-date-picker v-model="value1" type="date" placeholder=" ...

  9. elementUI 控制 DatePicker组件 不能选择 设定的日期

    <el-date-picker v-model="date" type="daterange" range-separator="至" ...

随机推荐

  1. 分布式自增ID算法snowflake

    分布式系统中,有一些需要使用全局唯一ID的场景,这种时候为了防止ID冲突可以使用36位的UUID,但是UUID有一些缺点,首先他相对比较长,另外UUID一般是无序的,作为索引非常不好,严重影响性能. ...

  2. 有关同时进行两条线路的四维dp

    今天发现自己完全对这种dp没有思路……我果然太蒻了./落泪.jpg 对于一个N*N的方格图中选择两条线路从左上角到右下角,其实只要用一个数组f[i][j][p][q]记录一个人走到(i,j)另一个人走 ...

  3. flannel overlay网络浅析

    Flannel基于UDP的网络实现 container-1的route表信息如下(b1): default via 100.96.1.1 dev eth0 100.96.1.0/24 dev eth0 ...

  4. •C#进阶系列——WebApi接口测试工具:WebApiTestClient

    阅读目录 一.WebApiTestClient介绍 二.WebApiTestClient展示 三.WebApiTestClient使用 1.如何引入组件 2.如何使用组件 四.总结 正文 前言:这两天 ...

  5. [v]Windows下Git安装指南

    参考<Git权威指南>安装整理,图书配套网址参见[1] 1. Cygwin下安装配置Git 1. 在Windows下安装配置Git有2种不同的方案 (1)msysGit, (2)Cygwi ...

  6. 8. Java的运算符

    计算机的最基本用途之一就是执行数学运算,作为一门计算机语言,Java也提供了一套丰富的运算符来操纵变量. 我们把运算符具体分为:算数运算符,比较运算符,逻辑运算符,位运算符,赋值运算符,条件运算符,i ...

  7. 关于微信小程序iOS端时间格式兼容问题

    经过测试发现,当时间格式为 2018-08-08 08:00 ,需要将时间转为其他格式时,Android端转换成功,iOS端报错或是转为NaN 这是因为iOS端对符号‘ - ’不支持,也就是说iOS端 ...

  8. vue-resource发送请求

    <!DOCTYPE html> <html> <head> <title>vue-resource</title> <meta cha ...

  9. TR-TR模块资料汇总

    转载: TR模块培训 https://www.docin.com/p-1704805923.html 现金管理(Cash Management)和预算控制(Cash Budget Management ...

  10. 2019.9.27,SAP成都研究院数字创新空间团队建设,射箭和游泳

    2019年9月27日,秋高气爽,SAP成都研究院数字创新团队全体成员又迎来了一次团队建设活动.这次的主题是:射箭. 在正式活动之前,大家先享用了一顿泰式海鲜火锅: 吃饱喝足之后,我们来到了名为&quo ...