elementUI 上传upload组件和表单验证(自定义验证规则)

用户头像上传组件, 注意action路径问题,图片上传控制台报404错误,控制台 network选项卡查看请求。思考,发现请求路径不对,这里需要完整路径 elementUI  上传upload组件和表单验证(自定义验证规则) el-upload 组件里的两个事件回调 图片上传之前验证图片,大小、格式 图片上传成功把服务器返回数据给表单

elementUI  上传upload组件和表单验证(自定义验证规则)

 

 

修改品牌名称 思考这里拷贝数据为什么要用浅拷贝,扩展运算符实现浅拷贝{...row},思考直接赋值与浅拷贝与深拷贝关系 为什么这里不能用直接赋值,会导致拷贝失败,引用对象与原对象联动修改 elementUI  上传upload组件和表单验证(自定义验证规则)

 

 

      表单验证   elementUI成熟组件,看文档即可学会 Form 组件提供了表单验证的功能,只需要通过 rules 属性传入约定的验证规则,并将 Form-Item 的 prop 属性设置为需校验的字段名即可 elementUI  上传upload组件和表单验证(自定义验证规则)

 

 

表单验证规则   自定义校验规则 重点,注意自定义校验规则和rules的的书写位置 elementUI  上传upload组件和表单验证(自定义验证规则)

弹窗按钮发情求前需全部验证后通过,故需要在添加按钮的回调  外套一个表单全部通过验证,ref打点拿到需要验证的表单

elementUI  上传upload组件和表单验证(自定义验证规则)

注意,因为这里嵌套了验证函数,所以这里async标记需要套在就近的函数上

 elementUI  上传upload组件和表单验证(自定义验证规则)

 

 

 

 

 

 

上一篇:vue- elementUi 分页偶数


下一篇:python – 通过pybind11返回numpy数组