The verification rule in element-ui is changed to click submit for verification

now the input will constantly request data according to the event change. Instead, click the submit button to request the data. I replaced the change in trigger with blur, click submit. If the information is repeated correctly, but if the information is not repeated, you need to click submit twice to correctly perform the following operations (analysis of the reason: when you click submit for the first time, it makes input lose focus), which does not meet the requirements.?. It"s been stuck for a long time. I don"t know how to change it.

<el-dialog title="" width="30%" :visible.sync="dialog.dialogFormVisible">
      <el-form :model="dialog" ref="dialogForm" size="small" :rules="dialog.rules" @submit.native.prevent>
        <el-form-item label="" prop="name">
          <el-input :maxlength="20" v-model="dialog.name" auto-complete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" type="primary" @click="submitMater"></el-button>
        <el-button size="small" @click="dialog.dialogFormVisible = false"></el-button>
      </div>
    </el-dialog>
< hr >
data() {
      let sendFlag = 0;
      let checkDialogForm = (rule, value, callback) => {
        if (!value) {
          return callback(new Error(""));
        }
        this.materialname = value;
        let postData = Object.assign({}, this.postUser, {
          "materialname": value
        });
        if (sendFlag === 0) {
          sendFlag = 1;
          checkModularNameApi(postData)
            .then((res) => {
              sendFlag = 0;
              if (res.data.result === 0) {
                callback();
              } else {
                callback(new Error(res.data.message));
              }
            })
            .catch(() => {
              sendFlag = 0;
            })
        }
      };
      return {
        noticeFlag: false,
        showNotice: false,
        txtIndex: 0,
        picIndex: 0,
        btnIndex: 0,
        dialog: {
          dialogFormVisible: false,
          dialogCancelVisible: false,
          name: "",
          rules: {
            name: [
              {max: 20, message: "20", trigger: "blur"},
              {message: "(\""\\)", trigger: "blur", pattern: /^[^""\\]+$/g},
              {validator: checkDialogForm, trigger: "blur"}
            ]
          }
        },
< hr >

submitted function

 submitMater() {
          checkDialogForm();
        this.$refs["dialogForm"].validate((valid) => {
          if (valid) {
            this.dialog.dialogFormVisible = false;
            //
            let postData = Object.assign({}, this.postUser, {
              "templateid": this.templateid,
              "materialname": this.materialname,
              "pvendorid": this.product.pvendorid,
              "prstypeid": this.product.prstypeid,
              "userid": this.product.userid,
              "modules": this.list,
              "id": this.submitid,
              "wxShare": this.wxShare,
              "savetime": this.savetime,
              "ccodecheckpop": this.ccodecheckpop,
              "wxAppCheckResult": this.checkresultlist
            });
            if (this.submitstatus === "detail") {
              updateMaterialApi(postData)
                .then((res) => {
                  if (res.data.result === 0) {
                    this.$router.push(`/productlist/${this.product.pvendorid}`)
                  } else {
                    this.$message({
                      message: res.data.message,
                      type: "error"
                    });
                  }
                })
                .catch((err) => {
                  this.$message({
                    message: err,
                    type: "error"
                  });
                });
            } else {
              addMaterialApi(postData)
                .then((res) => {
                  if (res.data.result === 0) {
                    this.$router.push(`/productlist/${this.product.pvendorid}`)
                  } else {
                    this.$message({
                      message: res.data.message,
                      type: "error"
                    });
                  }
                })
                .catch((err) => {
                  this.$message({
                    message: err,
                    type: "error"
                  });
                });
            }
          } else {
            return false;
          }
        });
      }

ask for help QAQ

Apr.01,2021

trigger: "submit" should solve your problem, I guessed it myself:)

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1ea6894-1de3.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1ea6894-1de3.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?