El envío de elementos no activa la solicitud; la verificación personalizada no escribe la función de devolución. . .

El pequeño novato de este lugar ha pisado dos veces el foso, oooooo ...

elemento + vista

Este es un evento de envío de formulario. Hay una verificación personalizada en el formulario. La verificación cumple con las condiciones y la consola no informa un error, pero la solicitud no se activa. ¿Por qué es esto ???

Al principio pensé que era un problema de método de escritura, pero no lo era, jajaja

La razón es: no hay función de devolución de devolución de llamada () en la verificación personalizada, porque no hay función de devolución de llamada () al ingresar a la verificación personalizada.

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

¡¡¡Así que recuérdalo !!!

¡La verificación personalizada debe tener una función de devolución!
1. Haga clic en el botón "Aceptar"

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

2. Forma

 <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. Definido en datos

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

4. Control personalizado

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. Método

 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
          })
        }
      })
    }
}