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:

 

 1 *****data:
 2 formValidate: {
 3           name: '',
 4           dates: []
 5         },
 6 
 7         ruleValidate: { //表單校驗
 8           name: [
 9             {required: true, message: 'The name cannot be empty', trigger: 'blur'}
10           ],
11           dates: [{
12             required: true,
13             type: 'array',
14             message: "Please select the date",
15             trigger: 'blur',
16             fields: {
17               0: {type: "date", required: true, message: "Please select the date"},
18               1: {type: "date", required: true, message: "Please select the date"}
19             }
20           }]
21         },
22 
23 
24 *******methods:
25 handleSubmit(name) {
26         this.$refs[name].validate((valid) => {
27           if (valid) {
28             this.$Message.success('Success!');
29           } else {
30             this.$Message.error('Fail!');
31           }
32         });
33       },
34 
35 queryClick() {
36         this.handleSubmit('formValidate1');
37         if (this.startDate) {
38           this.stationRequest();  //調接口
39         }
40       }，

// 時間觸發changeTime(val) {  this.startDate = val[0];  this.endDate = val[1];}