两个el-date-picker控件进行值比较

前言

项目在做环比周期时，用到了两个el-date-picker控件，这两个控件需要进行值大小比较，也折腾了一两个小时，效率有点低了，下面记录下影响我效率的点的地方，希望也能帮到各位读者们。注：下面的代码中没有完全进行展示，只是拿出了其中一个进行展示，另外一个其实跟这个类似，一样的道理

时间控件类型

此类型我用的是dates也就是支持选择多个日期的，具体的用的是element UI的控件。
代码如下：

 <el-date-picker
            ref="datesRef"
            type="dates"  //支持选择多个日期的时间控件类型
            v-model="value1"
            :editable="false"
            format="yyyy-MM-dd"
            @change="changeDate1"
            value-format="yyyy-MM-dd"
            placeholder="开始日期-结束日期"
          >
          </el-date-picker>

值比较

这里遇到的问题就是判断无效问题，原因是我只进行了null和""的判空，但在前端里还需进行undefined的判断。
具体实现代码如下：

 changeDate1() {
      if (
        this.value2 != null &&
        this.value2 != "" &&
        this.value2 != undefined
      ) {
        if (this.value1 >= this.value2 || this.value2.includes(this.value1)) {
          this.$message(
            "错了哦，第一周期时间需小于第一周期时间,请重新选择"
          );
          this.value1="";
        } else {
          console.log(222);
        }
      }
    },

总结

实战出真理，多做多积累