需求:

  时间选择器,只能选择 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. idea 默认全局配置maven,避免每次新建项目都需要指定自己的maven目录

      版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/qq_28624243/article/details/84199937 File->Oth ...

  2. 初始化一个React项目(TypeScript环境)

    React将由三部分组成,其中,Redux是应用状态管理服务,React-Router用于路由映射,React View用于显示界面. 我们使用Facebook推荐的create-react-app来 ...

  3. Python入门学习——PyQt5程序基本结构

    在学习python GUI部分时,一开始看书有点懵,看不懂框架,以下是个人学习所得(参考了别人的视频讲解),错误之处,望大家指教 #0.导入需要的包和模块from PyQt5.Qt import * ...

  4. AVR单片机教程——如何使用本教程

    这是一篇元教程(meta-tutorial)——其他教程教你怎么使用AVR单片机,本篇教程教你如何使用本系列教程. 我们的教程已经把板载LED讲完了,但是教会你的不应该只是如何使用LED.你应该已经知 ...

  5. 【HC89S003F4开发板】 3串口调试

    HC89S003F4开发板串口调试 使用资料自带的demo 主程序 /************************************系统初始化************************ ...

  6. 在vue中使用ElementUI

    完整引用ElementUI: 安装:在需要使用到的vue项目目录下,使用npm下载安装: npm/cnpm i element-ui -S/--save <!-- 引入样式 --> < ...

  7. sqlserver 查看表死锁

    1.SELECT request_session_id spid,OBJECT_NAME(resource_associated_entity_id) tableName FROM sys.dm_tr ...

  8. 怎样输出Hello World

    方法一: 进入python交互模式, 然后使用: print()函数输出 方法二:  新建一个.py文件, 然后写入print()函数, 再使用python命令执行输出:

  9. C# DataGridView 动态添加列和行

    https://blog.csdn.net/alisa525/article/details/7350471 dataGridView1.ReadOnly = true ;      //禁用编辑功能 ...

  10. NRF52832 Mesh SDK 调试记录

    1.Mesh SDK模型,Node节点在重启之后,心跳不能正常保持,即无法在次启动心跳的解决办法: 原因:主要是因为相关模型没有从Flash里面读取所致,因此只需要回复保存配置即可. 关键代码如下: ...