关于element 表单规则验证的那些坑

element里的prop只能有一个值,如果你要验证的el-from-item里面有两个及以上要验证的内容,那就满足不了,这时候就得自定义验证规则了.

<el-form-item prop="publishStartDate" :label="$t('createMeeting.REGISTRATION_TIME')">
                <el-date-picker type="date" value-format="yyyy-MM-dd" :placeholder="$t('createMeeting.START_TIME')"
                  v-model="meetingForm.publishStartDate" :picker-options="pickerBeginDate0"></el-date-picker>
                <span>&nbsp;&nbsp;&nbsp;</span>
                <el-time-select v-model="meetingForm.publishStartTime" :picker-options="{
                  start: '00:00',
                  step: '00:30',
                  end: '23:30'
                }"></el-time-select>
  </el-form-item>

 let checkStartTime = (rule, value, callback) => {
      let StartTime = this.meetingForm.publishStartTime;
      if (!value || !StartTime) {
        callback(
          new Error(this.$t("meetingValidator.meetingStartDatePublish.require"))
        );
      } else {
        callback();
      }
    };

 publishStartDate: [
          {
            validator: checkStartTime,
            trigger: "blur"
          }
        ],

在这里借鉴了别人的思路获取到第二个时间选择器的值,然后进行判断,当时在写的时候添加了验证规则之后表单无论如何都提交不了,后来才发现自定义规则一定要加else里面的callback(),不然表单提交不了,