iView之DatePicker的datetimerange校验

使用DatePicker的type是datetimerange时，处理开始--结束的持续时间校验如下。
遇到的问题：
时间弹出校验提示，但是程序还是会继续往下走，所以调完校验后，再做判断开始时间是否为true，再调接口。

view:

 <Col span="8">
              <FormItem label="时间段:" prop="dates">
                <DatePicker type="datetimerange" placeholder="Select date" v-model="formValidate.dates"
                            style="width: 100%" @on-change="changeTime">
                </DatePicker>
              </FormItem>
              </Col>
              <Col span="8">
              <FormItem class="inline-submit">
                <Button type="primary" @click="queryClick">查询</Button>
              </FormItem>
              </Col>

js:

 

*****data:
formValidate: {
          name: '',
          dates: []
        },

        ruleValidate: { //表单校验
          name: [
            {required: true, message: 'The name cannot be empty', trigger: 'blur'}
          ],
          dates: [{
            required: true,
            type: 'array',
            message: "Please select the date",
            trigger: 'blur',
            fields: {
              0: {type: "date", required: true, message: "Please select the date"},
              1: {type: "date", required: true, message: "Please select the date"}
            }
          }]
        },


*******methods:
handleSubmit(name) {
        this.$refs[name].validate((valid) => {
          if (valid) {
            this.$Message.success('Success!');
          } else {
            this.$Message.error('Fail!');
          }
        });
      },

queryClick() {
        this.handleSubmit('formValidate1');
        if (this.startDate) {
          this.stationRequest();  //调接口
        }
      }，

// 时间触发
changeTime(val) {
  this.startDate = val[0];
  this.endDate = val[1];
}