明明在<el-form>里添加:rules="dataRule"这个属性,且也在js代码里加入了dataRule的定义,
即对<el-form-item><el-select>标签里添加了字段必填不能为空的message提示。

但奇怪的是在表单提交时,竟还是没有字段为空的限制,竟还是提交成功了?

查了半天代码,才发现就是提交表单的函数有问题,原来是我没有加dataForm的校验判断,添加正确的代码如下:

this.$refs['dataForm']
          .validate((valid) => {
            if (valid) {
              this.$http({
                url: `*********`,
                method: 'post',
                data: this.dataForm
              }).then(({data}) => {
                if (data && data.code === 0) {
                  this.$message({
                    message: '操作成功',
                    type: 'success',
                    duration: 1500
                  })
                  this.visible = false
                }
              })
            }
          })

这个this.$refs['dataForm'].validate()很重要啊!千万别忘记了,否则你设置的多个From表单字段有效性或为空验证就失效了。

Logo

前往低代码交流专区

更多推荐