支持点击今天及之前任意日期,前后跨度不超过31天,且不超过今天

<el-date-picker
v-model="searchForm.dateRange"
type="daterange"
:clearable="false"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format = "yyyy-MM-dd"
:picker-options="pickerOptions"
></el-date-picker>

  

data() {
minDate:'',
maxDate:'',
pickerOptions: {
onPick: ({ maxDate, minDate }) => {
this.minDate = minDate
this.maxDate = maxDate
},
disabledDate: (time) => { //查询时间跨度为31天
if(this.minDate){
let range = 31 * 24 * 3600 * 1000
return time.getTime() > Date.now() || time.getTime() > (this.minDate.getTime() + range) || time.getTime() < (this.minDate.getTime() - range)
}
return time.getTime() > Date.now()
}
}
}

  

element-ui 中日期控件限制时间跨度的更多相关文章

  1. Element ui tree树形控件获取当前节点id和父节点id

    低版本Element ui tree树形控件获取当前节点id和父节点id的方法:点击查看 最新版本Element ui tree树形控件获取当前节点id和父节点id教程: 1.找到node_modul ...

  2. [原创] Web UI 自动化日期控件的处理

    序 在构建自动化套件的过程中,日期操作是一件很重要也很频繁的事情.有的日期控件的div层级结构复杂,同一个类型的日期控件在多个子系统中的表现形式也大相径庭.多数工程师为了避免重复的工作,会封装抽象一个 ...

  3. Qt中在UI文件中新建控件并命名,但在代码中无法识别UI中的控件?

    代码中添加FilePathLineEdit控件,显示标准文件选择对话框显示选择的文件路径,但在槽函数中ui->FilePathLineEdit->setText("FilePat ...

  4. 批量操作QT UI中的控件

    背景:在一个项目中,可能一个UI中存在大量相同的tablewidget,combobox,label等控件,每种可能有100个,此时想对它们进行同样的操作 方案:(以tablewidget为例,UI中 ...

  5. vue+element ui 的时间控件选择 年月日时分

    前言:工作中用到 vue+element ui 的前端框架,需要选择年月日时分,但element ui官网demo有没有,所以记录一下.转载请注明出处:https://www.cnblogs.com/ ...

  6. vue的$nextTick使用总结,this.$refs为undefined的解决办法,element Ui的树形控件setCheckedKeys方法无法使用

    其实这3个讲的是一个问题,先说下问题,我在watch里设置一个监听,当弹窗打开时,自动添加树形的默认选中项, 但奇怪的是this.$refs为undefined,自然setCheckedKeys无法使 ...

  7. Element ui tree树形控件获取父节点id

    Element-ui官网给的方法 getCheckedKeys() { console.log(this.$refs.tree.getCheckedKeys()); }, 这种只有在所有子级都被选中的 ...

  8. 【经验】Angularjs 中使用 layDate 日期控件

    layDate 控件地址:http://laydate.layui.com/ 前情:原来系统中使用的日期控件是UI bootstrap(地址:https://angular-ui.github.io/ ...

  9. jQuery UI 日期控件--datepicker

    在web开发中,日期的输入经常会遇到.我们会用的解决方法有: 1.自己写css和js,对日期进行控制:----有点浪费精力和时间: 2.用easyui插件中的日期插件来实现: 3.用juqery-ui ...

随机推荐

  1. 在业务控制方法中写入包装User的模型来收集参数

    可以在业务控制方法中书写0个或多个模型来收集客户端的参数 1)  如果多个模型中有相同的属性时,可以用user.name或admin.name来收集客户端参数 2)  用一个新的模型将User和Adm ...

  2. BCNF/3NF的判断方法

    判断是否是 3NF 的条件: 对于 R 上的每个函数依赖 X->A (X 是关系 R 属性的一个子集,A 是 R 的一个属性) ,以下条件中的一个成立:1 X ∈ A2 X 是超码3 A 是 R ...

  3. [spring boot]idea中实现热部署的方法

    发生了任何修改之后,必须关闭后再启动Application类才能够生效,显得略微麻烦. Springboot提供了热部署的方式,当发现任何类发生了改变,马上通过JVM类加载的方式,加载最新的类到虚拟机 ...

  4. C++中重载、重定义、重写概念辨析

    重载:函数名相同,函数的参数个数.参数类型或参数顺序三者中必须至少有一种不同.函数返回值的类型可以相同,也可以不相同.发生在一个类内部. 重定义:也叫做隐藏.覆盖,子类重新定义父类中有相同名称的非虚函 ...

  5. Expecting "jsp:param" standard action with "name" and "value" attributes

    浏览器访问报如下jsp标签错误: 根据提示,定位到jsp页面124行,代码如下: 查找原因,当<jsp:include></jsp:include>标签中没有参数时,不允许有空 ...

  6. Cloudera Manager 常见异常

    1. Cloudera Management Service服务全部无法启动 观察到的现象: (1)cm service 组件无法启动,启动时服务请求超时终止:(2)主机信息也无法获取到,一直提示“无 ...

  7. Linux命令集锦:tmux命令

    tmux是一款优秀的终端复用软件,平时用到的强大功能有下面两个: 窗口管理:同时启用多个窗口: 保护现场:连接到远程主机之后,一旦断开,那么当前账户登录的任务就被取消了,但是使用 tmux 可以在断开 ...

  8. 1. Linux基本操作和基本命令

    常用快捷键: Ctrl + d : 结束符 Ctrl + c : 中断前台进程 Ctrl + z : 将前台进程停止掉   创建终端: 创建终端标签:Ctrl + Shift + t; 切换标签: A ...

  9. Git安装以及配置SSH Key——Windows

    安装 安装 Git 官网下载一个Windows版本的Git. 然后一直下一步即可,如下图 环境变量自动配好的,可以去检查一下环境变量中PATH中有没有Git的环境变量 然后在桌面右击鼠标,选择Git ...

  10. 2019-2020 ICPC, Asia Jakarta Regional Contest A. Copying Homework

    Danang and Darto are classmates. They are given homework to create a permutation of N integers from  ...