Element submission does not trigger the request-the custom check does not write the return function. . .

The little rookie in this place has stepped on the pit twice, oooooo...

element + view

This is a form submission event. There is a custom check in the form, the check meets the conditions, and the console does not report an error, but the request is not triggered. Why is this???

At first I thought it was a problem of method writing, but it was not, hahaha

The reason is: there is no callback() return function in the custom verification, because there is no callback() function in the custom verification, and when the submit method is triggered, it will always wait for the result in it, and you can only go to the following code:

 this.$refs['formDeposite'].validate(valid => {})

So remember it!!!

Custom verification must have a return function!!!
1. Click the "OK" button

 <template slot="btn-inner">
      <el-button :loading="loading.submit" @click="submitForm" icon="iconfont icon-tijiao" type="primary">确认</el-button>
    </template>

2. Form

 <el-form
            :model="formDeposite"
            :validate-on-rule-change="false"
            label-position="left"
            label-width="140px"
            :rules="rules"
            ref="formDeposite">
            <div class="area-title">
              <p class="title">资金信息</p>
            </div>
            <div class="form-inner">
              <el-row :gutter="80">
                <el-col :span="12">
                  <el-form-item label="冻结金额：" >
                    <span>{
   
   {utils.moneyFormat(form.financeFee.benjin)}}元</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <!-- 交易日期不能大于保证金申请日期 -->
                  <el-form-item label="交易日期：" prop="hkDate">
                    <el-date-picker
                      v-model="formDeposite.hkDate"
                      type="date"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
</el-form>

3. Defined in data

 data () {
  // 提交表单
      formDeposite: {}
}

4. Custom check

data () {
    let checkTime = (rule, value, callback) => {
      if (value < this.form.financeFee.createdAt) {
        return callback(new Error('交易时间不能早于保证金生成时间'))
      } else {
        callback()
      }
    }
    return {
      // 校验
      rules: {
        hkDate: [
          this.rulesToolkit.rules.required({name: '交易时间'}),
          { validator: checkTime, trigger: 'blur' }
        ]
      }

5. Method

 methods: {

    /**
     * 提交
     */
    submitForm () {
      this.$refs['formDeposite'].validate(valid => {
        if (valid) {
          this.loading.submit = true
          this.formDeposite.financeCode = this.financeCode
          let financeFee = this.formDeposite
          this.api.deposit.manage.commit(financeFee).then(result => {
            this.loading.submit = false
            this.$message.success(result.data.message)
            this.$router.back()
          }).catch(e => {
            this.loading.submit = false
          })
        }
      })
    }
}