{
title: '开始时间',
key: 'planDateFrom',
minWidth: 120,
sortable: true,
align: 'center',
render: (h, params) => {
return h('DatePicker', {
props: {
value: params.row.planDateFrom,
type: 'datetime',
format:"yyyy-MM-dd HH:mm:ss",
editable: false,
transfer: true,
options: {
disabledDate: (date) => {
if (params.row.planDateTo) {
return date && date.valueOf() > new Date(params.row.planDateTo).valueOf();
};
if (!params.row.planDateFrom) {
return false;
};
}
}
},
style: {
width: '100%'
},
on: {
'on-change': (e) => {
if (e) {
params.row.planDateFrom = e;
this.tableData[params.index] = params.row;
} else {
params.row.planDateFrom = ''; // 必须有各种判断,否则清空时无法解除之前的禁用
this.tableData[params.index] = params.row;
};
}
}
});
}
},
{
title: '结束时间',
key: 'planDateTo',
minWidth: 120,
sortable: true,
align: 'center',
render: (h, params) => {
return h('DatePicker', {
props: {
value: params.row.planDateTo,
type: 'datetime',
format:"yyyy-MM-dd HH:mm:ss",
editable: false,
transfer: true,
options: {
disabledDate: (date) => {
if (params.row.planDateFrom) {
return date && date.valueOf() < new Date(params.row.planDateFrom).valueOf();
}
if (!params.row.planDateTo) { // 不存在时,取消禁用
return false;
};
}
}
},
style: {
width: '100%'
},
on: {
'on-change': (e) => {
if (e) {
params.row.planDateTo = e;
this.tableData[params.index] = params.row;
} else {
params.row.planDateTo = '';
this.tableData[params.index] = params.row;
};
}
}
});
}
},

  

iview render Datepicker 起止时间限制的更多相关文章

  1. iview datepicker 选择的时间少一天

    使用iview的datepicker时间选择器发现获取的value值是比实际要少一天,严格来说应该是时间格式不一样,datepicker获取的时间是UTC时间格式,也就是:yyyy-MM-ddTHH: ...

  2. C#根据当前时间获取周,月,季度,年度等时间段的起止时间

    最近有个统计分布的需求,需要按统计本周,上周,本月,上月,本季度,上季度,本年度,上年度等时间统计分布趋势,所以这里就涉及到计算周,月,季度,年度等的起止时间了,下面总结一下C#中关于根据当前时间获取 ...

  3. iview render bug & vue namespace bug

    iview render bug https://codepen.io/xgqfrms/pen/gyGjKP https://codepen.io/xgqfrms/full/gyGjKP bug &l ...

  4. DatePicker日期与时间控件

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

  5. 为Redmine的项目加上起止时间

    没有时间约束的项目不是好项目. 要给项目配置起止时间,须要用到自己定义属性. 我们须要管理员身份登录.才干够定义自己定义属性. 自己定义属性 看图吧,先是点击页面导航条(最上面那排菜单,有主页.我的工 ...

  6. vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下

    vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下 renderHeader: (h, params) => { return [ h('Rad ...

  7. iview组件DatePicker type="datetimerange绑定初始默认时间值

    使用::value="[this.startTime,this.endTime]",绑定当天时间 如下: <DatePicker type="datetimeran ...

  8. Ant Design 通过 WeekPicker 获取一周的起止时间

    项目中遇到了选择日期获取当前日期一周的周一和周日的日期,如下: 项目使用的是 ant design,所以第一时间想到了 DatePicker 中的 WeekPicker 组件,查询文档得到 WeekP ...

  9. iView之DatePicker的datetimerange校验

    使用DatePicker的type是datetimerange时,处理开始--结束的持续时间校验如下.遇到的问题:时间弹出校验提示,但是程序还是会继续往下走,所以调完校验后,再做判断开始时间是否为tr ...

随机推荐

  1. Linux 进程终止后自动重启

    /opt/a.sh #! /bin/bash ps -ef | grep python3 a.py | grep -v grep | grep python3 if [ $? -ne 0 ] then ...

  2. WindowUtils【窗口工具类】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 判断当前界面是横屏还是竖屏: 获取当前界面方向. 效果图   代码分析 isLandscape(Context context): ...

  3. FragmentTabHostUnderLineDemo【FragmentTabHost带下划线】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 使用FragmentTabHost实现顶部选项卡(带下划线效果)展现. 效果图 代码分析 1.该Demo中采用的是FragmentT ...

  4. AsyncTask原理

    一.概述 Android开发中我们通常让主线程负责前台用户界面的绘制以及响应用户的操作,让工作者线程在后台执行一些比较耗时的任务.Android中的工作者线程主要有AsyncTask.IntentSe ...

  5. [逆向工程] 二进制拆弹Binary Bombs 快乐拆弹 详解

    二进制拆弹 binary bombs 教你最快速解题,成功拆弹 最近计算机基础课,的实验lab2,二进制拆弹,可以说是拆的我很快乐了(sub n, %hair) 此处头发减n 我刚开始做的时候很是懵逼 ...

  6. Flink从入门到放弃(入门篇4) DataStreamAPI

    戳更多文章: 1-Flink入门 2-本地环境搭建&构建第一个Flink应用 3-DataSet API 4-DataSteam API 5-集群部署 6-分布式缓存 7-重启策略 8-Fli ...

  7. interrupt interrupted isInterrupted 方法对比、区别与联系 多线程中篇(八)

    interrupt interrupted isInterrupted 是三个“长相”非常类似的方法. 本文将对这三个方法简单的对比下,首先了解下线程停止的方式 线程停止方式 在Java中如果想停止一 ...

  8. .net core +codefirst(.net core 基础入门,适合这方面的小白阅读,本文使用mysql或mssql)

    设置为model所在的那一层 前言 .net core mvc和 .net mvc开发很相似,比如 视图-模型-控制器结构.所以.net mvc开发员很容易入手.net core mvc .但是两个又 ...

  9. 纯手写springIOC

    大家好啊- 那么今天来带大家写一下spring的ioc. 其实也很简单,首先我们明白两点,java解析xml和java的反射机制,因为ioc就是主要是基于这两个来实现,今天只是简单的来大家实现下. 废 ...

  10. 前后端分离密码登陆加密RSA方案(java后端)

    前言:密码加密有很多种方案,这里不做过多讨论,本篇文章是基于RSA加密实现. 首先在前端工程中需要引入加密js: "jsencrypt": "2.3.1",(注 ...