element-ui中的验证规则改为点击提交进行验证

Question

现在的是input中会根据事件change去不停请求数据，要改为点击提交按钮再去请求数据，我把trigger中的change换成了blur，点击提交，如果信息重复能正确提示，但是如果信息是不重复的，需要点击两次提交才能正确的进行后面的操作（分析原因：第一次点击提交的时候，是让input失去焦点），不符合需求，卡了好久不知道怎么改。

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

---

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'}
            ]
          }
        },

---

提交的函数

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

求帮助QAQ

Answer 1

trigger: "submit" 应该可以解决你的问题，我自己猜出来的 : )