关于javascript:js判断多个日期时间段中是否互相存在交集

93次阅读

共计 1376 个字符,预计需要花费 4 分钟才能阅读完成。

js 判断多个日期时间段中是否相互存在交加

最近有个需要,应用 Element 的 dateRange 抉择多个时间段时,要求它们不能有交加,任意两个日期都不能有交加,临界点也不行,网上找了些材料,都不是很称心,于是本人入手来实现了,次要思路是将每次抉择的日期范畴生成一个日期数组,而后应用 lodash 来比照这些数组是否有交加的元素。

应用到的包 / 库有:dayjs,lodash 的 intersection。
为什么不应用 momentjs,切实因为它太大了,dayjs 玲珑,简直都能实现 moment 性能。至于 intersection 则是用它来判断多个数组数组的交加,持续往下看!~~

// 上面的例子,很显著 2020-09-11 是交加
const date1 = ['2020-09-01','2020-09-11'];
const date2 = ['2020-09-11','2020-09-30'];

上面用代码来实现吧。

通过 el-date-picker 收集用户抉择的日期,这是一个范畴
<el-date-picker @change="selectSpecialDateRange(index)" v-model="item.time" type="daterange" value-format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期" end-placeholder="完结日期"></el-date-picker>
导入相应包
 import dayjs from 'dayjs'
 import {intersection} from 'lodash'
methods 办法:
// 这里次要 就是应用了 dayjs 干了一件事,// 将日期范畴生成了一串数组,// 比方:['2020-09-01','2020-09-03'] 
//=> ['2020-09-01','2020-09-02','2020-09-03']
selectSpecialDateRange(index){const timeRange = this.Datelist[index].time
    this.Datelist[index].dateArr = []
    let i=0
    while(true){const endTime = dayjs(timeRange[0]).add(i, "days").format("YYYY-MM-DD")
    
      this.Datelist[index].dateArr.push(endTime)
      
      // 与最初一个日期雷同,跳出循环
      if(endTime == timeRange[1]){break;}
      i++
    }
    
    // 上面就每两两进行比拟
    const userArr1 = this.Datelist.map(v=>v.dateArr)
    let flag = false 
    for(let i=0;i<index;i++){
        // 每次和之前抉择的日期范畴两两比拟
      const res = intersection(userArr1[index],userArr1[i])
      if(!!res.length){
        flag = true;
        break;
      }
    }
    if(!!flag){this.deleitem(index) // 做一个移除操作
      this.$message.error('您抉择的日期存在重叠')
      return false;
    }
}
效果图如下:

正文完
 0