el-form表单添加自定义验证

添加表单el-form

必不可少的字段: :model、ref、:rules 还有表单项里的prop

最后添加一个确定按钮和一个取消按钮,取消按钮的cancel功能是点击取消按钮及时清除验证信息 

在data() {}里面添加验证 规则

 

 在data的return里面引用验证规则

 

 在确定按钮里面使用验证

saveAdd: function() {
      this.$refs['addForm'].validate((valid) => {
        if (valid) {
            alert('valid)
        } else {
            alert('disvalid')
        }
      })
}

在取消按钮添加代码清除提示信息

cancel: function(formName) {
      this.$refs[formName].clearValidate()
    }

 

posted @ 2019-11-05 10:34  努力加油进步  阅读(214)  评论(0)    收藏  举报