资讯专栏INFORMATION COLUMN

elementui datepicker 时间联动选择,限制时间跨度.

genedna / 766人阅读

摘要:需求是只能查前后三个月左右的时间并且不能选择晚于当天的时间效果如图选择月号之后往前推天也就是月号之前都是灰色禁止选中往后同理看文档没有过多说明核心就是利用取到点击的时间然后根据动态的做一个限制清空重新选择的时候通过事件把限制规则重置自己敲一

需求是只能查前后三个月左右的时间,并且不能选择晚于当天的时间
效果如图:
选择11月10号之后,往前推90天(也就是8月10号)之前都是灰色 禁止选中,往后同理.

看element文档,没有过多说明,
核心就是利用onpick取到点击的时间,然后根据disabledDate动态的做一个限制
清空重新选择的时候通过change事件,把限制规则重置.

自己敲一下 应该还有更简单的办法

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/99255.html

相关文章

  • 怎样实现一个datePicker(日期选择)组件

    摘要:百度前端技术学院上有一个任务,要实现一个日期选择组件,本文由此而来看看需求组件默认一直呈显示状态通过某种方式选择年月,选择了年月后,日期列表做相应切换通过单击某个具体的日期进行日期选择组件初始化时,可配置可选日期的上下限。 百度前端技术学院上有一个任务,要实现一个日期选择组件,本文由此而来~ 看看需求 组件默认一直呈显示状态 通过某种方式选择年、月,选择了年月后,日期列表做相应切换 ...

    layman 评论0 收藏0
  • 怎样实现一个datePicker(日期选择)组件

    摘要:百度前端技术学院上有一个任务,要实现一个日期选择组件,本文由此而来看看需求组件默认一直呈显示状态通过某种方式选择年月,选择了年月后,日期列表做相应切换通过单击某个具体的日期进行日期选择组件初始化时,可配置可选日期的上下限。 百度前端技术学院上有一个任务,要实现一个日期选择组件,本文由此而来~ 看看需求 组件默认一直呈显示状态 通过某种方式选择年、月,选择了年月后,日期列表做相应切换 ...

    beanlam 评论0 收藏0
  • vue项目中使用element-ui下拉框选项值为对象时报错

    摘要:在做后台管理时,使用了搭配,请求方法使用了插件,在使用下拉框时,因为我需要获取选中的选项中的其他值,因此需要传入对象。 在做后台管理时,使用了vue搭配elementUI,请求方法使用了axios插件,在使用下拉框时,因为我需要获取选中的选项中的其他值,因此需要传入对象。对select下拉框的文档没有读的很仔细,百度过几篇文章,也没有理解他们表达的意思,然后自己又去看文档,把他的属性看...

    Drummor 评论0 收藏0
  • iView 近期的更新,以及那些“不为人知”的故事

    摘要:如图所示还有其它很多项的更新,比如新增属性,可以设置面板展开时默认显示的日期。目前最新版本支持键盘可访问性的组件有。期待你的加入下个版本预告下个版本计划重构组件,以全面支持表单组件的键盘可访问性,敬请期待。 在过去的两个多月里,iView 陆续发布了 2.9.0 和 2.10.0 两个重要版本。这两个版本总共有 255 个 commit,超过 40 项更新。来看一下,iView 具体都...

    UsherChen 评论0 收藏0
  • 使用Vue写一个datepicker

    摘要:演示地址希望大家能给个功能期望这个目前仅实现了一些常用的功能选择时间这话说得有点多余最大最小时间限制中英文切换其实也就星期和月份需要切换可以以形式使用,也可在浏览器环境中直接使用没了。。。 前言 写插件是很有意思,也很锻炼人,因为这个过程中能发现许多的细节问题。在前端发展的过程中,jQuery无疑是一个重要的里程碑,围绕着这个优秀项目也出现了很多优秀的插件可以直接使用,大大节省了开发者...

    luckyyulin 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<