Iview同步异步验证

Posted 2020-10-03 MvloveYouForever

直接上代码了：

html:
<Form ref="termForm" :model="currentData" :rules="ruleTerm" :label-width="80">
          <Form-item label="学期名称" prop="termname">
            <Input v-model="currentData.termname" placeholder="学期名称"></Input>
          </Form-item>
          <Form-item label="开学日期" prop="startday">
            <Date-picker type="date" v-model="currentData.startday" placeholder="选择日期"></Date-picker>
          </Form-item>
          <Form-item label="总周数" prop="weeks">
            <Input v-model="currentData.weeks"></Input>
          </Form-item>
          <Form-item prop="iscurrent">
            <Checkbox v-model="currentData.iscurrent">当前学期</Checkbox>
          </Form-item>
        </Form>

Js:

ruleTerm: {
          termname: [
            {required: true, message: ‘学期名称不能为空‘, trigger: ‘blur‘},
            {
              validator(rule, value, callback, source, options) {
                vuecom.checkName().then(() => {
                  callback();
                }, rej => {
                  console.log(‘---->rej‘, rej)
                  callback(new Error(rej));
                })
              }
            }
          ],
          startday: [
            {required: true, message: ‘开学日期不能为空‘, trigger: ‘blur‘},
            {
              validator(rule, value, callback, source, options) {
                vuecom.checkDay().then(() => {
                  callback();
                }, rej => {
                  callback(new Error(rej));
                })
              }
            }
          ],
          weeks: [
            {required: true, message: ‘总周数不能为空‘, trigger: ‘blur‘},
            {
              validator(rule, value, callback, source, options) {
                vuecom.checkDay().then(() => {
                  callback();
                }, rej => {
                  callback(new Error(rej));
                })
              }
            }
          ]
        }


checkDay(){
        return new Promise((res, rej) => {
          if (this.currentData.startday && this.currentData.weeks)
            termService.checkTermDate({
              startday: util.dateFormat(this.currentData.startday, "yyyy-MM-dd"),
              weeks: this.currentData.weeks
            }).then(data => {
              if (data.id == ‘1‘)
                res()
              else
                rej(data.operation)
            })
          else
            res()
        })
      },
      checkName(){
        return new Promise((res, rej) => {
          termService.checkTermName({termname: this.currentData.termname}).then(data => {
            if (data.id == ‘1‘)
              res()
            else
              rej(data.operation)
          });
        })
      },





saveValidate(name){
        this.$refs[name].validate((valid) => {
          if (valid) {
            this.saveData();
          }
        })
      },