js 计算两个日期之间相差几年几月几日

最新推荐文章于 2024-08-16 10:56:25 发布

温柔雨哥a

最新推荐文章于 2024-08-16 10:56:25 发布

阅读量3.8k

点赞数 4

文章标签： vue js

本文链接：https://blog.csdn.net/CSDN_bare/article/details/112323148

版权

Ant Design Vue 日期选择器计租期事件处理时间差计算

关键词由CSDN通过智能技术生成

1.日期选择器

   <a-form-model-item label="计租期" prop="Dates" :rules="{ required: true, message: '请输入计租期',trigger: 'blur',}">
      <a-range-picker style="width:300px;" v-model='form.Dates' :disabled='see' @change="changeDate" />
   </a-form-model-item>

在这里插入图片描述

2.定义开始时间和结束时间

 startTime: null,
 endTime: null

在这里插入图片描述

3.组件日期选择器的改变事件

这里用到的组件是ant-design-vue,当选择完日期后触发，调用写的计算日期选择器的方法，输出结果

  changeDate(times, e) {
      console.log(e)
      this.startTime = e[0]
      this.endTime = e[1]
      this.monthDayDiff()
    },

4. 计算时间差的方法

 monthDayDiff() {
      // this指针
      let _this = this;
      let flag = [1, 3, 5, 7, 8, 10, 12, 4, 6, 9, 11, 2];
      let start = new Date(_this.startTime);
      let end = new Date(_this.endTime);
      let year = end.getFullYear() - start.getFullYear();
      let month = end.getMonth() - start.getMonth();
      let day = end.getDate() - start.getDate();
      if (month < 0) {
        year--;
        month = end.getMonth() + (12 - start.getMonth());
      }
      if (day < 0) {
        month--;
        let index = flag.findIndex((temp) => {
          return temp === start.getMonth() + 1
        });
        let monthLength;
        if (index <= 6) {
          monthLength = 31;
        } else if (index > 6 && index <= 10) {
          monthLength = 30;
        } else {
          monthLength = 28;
        }
        day = end.getDate() + (monthLength - start.getDate());
      }
      this.result = `相差${year}年${month}月${day}天`;
      console.log(this.result)
    },