首页 > 其他分享 >日期区间选择器a-range-picker,选择的时间跨度不超过6个月

日期区间选择器a-range-picker,选择的时间跨度不超过6个月

时间:2023-07-19 15:14:01浏览次数:30  
标签:picker moment 禁用 Moment range month 选择 日期 选择器

需求

需要用到日期区间选择,选择开始时间之后,结束时间只能选前6个月或者后6个月,其它区间禁用。
image

思路

选择开始日期间为null,当选择开始时间之后,选择结束日期时禁用开始日期前后6个月之外的日期

实现

image

image

disabledDate禁用方法先判断有没有开始日期,如有有,则没有禁用规则。如果没有开始日期,则给定禁用规则

需要注意的点

因为使用了valueFormat="x"将绑定的value值从时间对象转换为时间戳了,所以calendarChange方法中的value拿到的是字符串。moment('字符串')这样是不生效的

扩展

moment(this.startTime).subtract(6, 'month')
moment(this.startTime).add(6, 'month')

Moment.js 的 subtract 方法用于从一个 Moment 对象中减去指定的时间数量。它返回一个新的 Moment 对象,表示计算后的日期和时间。除了'month'还有'year'、'day'、'hour'等参数

add用法相同

标签:picker,moment,禁用,Moment,range,month,选择,日期,选择器
From: https://www.cnblogs.com/wang--chao/p/17565655.html

相关文章

  • 伪类选择器,伪元素选择器,选择器的优先级,CSS属性相关
    伪类选择器<style>/*未访问时候显示的*/a:link{color:#FF0000;}/*鼠标移动到链接上*/a:hover{color:#FF00FF}/*选定的链接*/a:active{color:#0000......
  • vue手搓h5滚动日期选择器组件
    背景新项目为了省事和后台写一起了,所以用不了Uni-app(悲),然后element-ui的日期选择器h5不适配,看着也难受,就想找个好用的,结果找了一圈感慨,自己写个吧。 说明 为了加快速度,代码可能有些臃肿,但大概就是这样了,看着代码好多,其实只要会一个的滚动就会多个了。建议下看下参考文章,然后......
  • 关于 SAP ABAP 事务码 SM30 里的 Restrict Data Range
    SAPABAP事务码SM30里的RestrictDataRange区域的Enterconditions和Variant这两个选项有什么作用?SAPABAP中的SM30事务码用于维护表的条目。在使用SM30事务时,RestrictDataRange区域允许用户定义一些限制条件,可以帮助缩小查询或更改的数据范围。这对于大型表......
  • 界面控件DevExtreme v23.1新版亮点 - 全新的DateRangeBox组件
    DevExtreme拥有高性能的HTML5/JavaScript小部件集合,使您可以利用现代Web开发堆栈(包括React,Angular,ASP.NETCore,jQuery,Knockout等)构建交互式的Web应用程序。从Angular和Reac,到ASP.NETCore或Vue,DevExtreme包含全面的高性能和响应式UI小部件集合,可在传统Web和下一代移动应用程序中......
  • CF1456E XOR-ranges
    题面传送门好题。首先比较自然的,相当于按照数位DP的方法,将\([l,r]\)剖成\(k\)段,其中每一段都是最高若干位确定,底下若干位任取的形式。这样在\([l,r]\)里面选择相当于在这\(O(k)\)个区间里面选择。然后假设我们依次选择好了,考虑如何计算答案。答案显然是位独立的,对于......
  • Java复制(拷贝)数组的4种方法:arraycopy()方法、clone() 方法、copyOf()和copyOfRange
    http://c.biancheng.net/view/924.html所谓复制数组,是指将一个数组中的元素在另一个数组中进行复制。本文主要介绍关于 Java 里面的数组复制(拷贝)的几种方式和用法。在Java中实现数组复制分别有以下4种方法:Arrays类的copyOf()方法Arrays类的copyOfRange()方法Syst......
  • 爬取新闻 ,bs4, css选择器,selenium基本使用
    目录1爬取新闻2bs4介绍遍历文档树3bs4搜索文档树3.2其他用法4css选择器5selenium基本使用5.1模拟登录百度6selenium其他用法6.1无头6.2搜索标签1爬取新闻#1爬取网页---requests#2解析 ---xml格式,用了re匹配的 ---html,bs4,lxml。。。---json: -python......
  • Go 语言 for-range 的两个坑,你踩过吗?
    坑一:迭代时协程引用索引和值先看看下面的例子,你知道最终输出的结果是什么吗?packagemainimport( "fmt" "time")funcmain(){ varm=[]int{1,3,5} fori,v:=rangem{ gofunc(){ fmt.Println(i,v) }() } time.Sleep(time.Second)}不知道的同学......
  • 5. Q_ 伪类选择器__checked_将作用与_input_类型为_radio_或者_check
    Q:伪类选择器:checked将作用与input类型为radio或者checkbox,不会作用于option。A:不对。伪类选择器checked的定义很明显:The:checkedCSSpseudo-classselectorrepresentsanyradio(<inputtype="radio">),checkbox(<inputtype="checkbox">)oroption(<opti......
  • 20. Q_ _only_ 选择器的作用是_
    Q:only选择器的作用是?@mediaonlyscreenand(max-width:1024px){argin:0;}A:停止旧版本浏览器解析选择器的其余部分。only用来定某种特定的媒体类型,可以用来排除不支持媒体查询的浏览器。其实only很多时候是用来对那些不支持MediaQuery但却支持MediaType的设备隐......