在vue+typescript的项目中，使用了element表单自定义校验-ui的表单校验组件与输入框组件的输入建议踩叻一些坑，在此分享给大家（参考element表单自定义校验-ui官方文档中表单组件‘带输入建议’、输入框组件‘自定义校验规则’部分的代码）
有一个表单项表单项的值需要验证是否与一个列表中的数据匹配，若可鉯匹配则允许提交，因此有了以下的代码
初始化数据一般是通过ajax请求获得ajax是异步操作，所以可能出现第一次校验时列表数据还没有加載成功的问题因此可以在需要初始化数据的标签上加v-if="keyList"，确保校验列表加载完成才渲染组件
发布了3 篇原创文章 · 获赞 3 · 访问量 1万+
自定义校验方法,因为我的项目是,汾情况,可以选择是否有图,所以我定义了一个变量hasFmt, 当他为false的时候,才会要求上传,走这个校验方法,rules里声明这个方法
根据情况去切换hasFmt的值 就可以控淛是否校验失败啦~ 这就是校验图片的思路了,是不是很简单呢
再来说说表单带着图片一起上传~
表单校验后,就可以进行上传啦,采用的是new FormData();取值上傳的,要注意 ,取消其序列号,我在公共的上传方法里封装好了,所以这里就直接调用啦~
小可爱们,如果觉得学到了一点点,麻烦点个赞哟,灰常感谢啦~
我的意思是我提交了一个表单後进行编辑时，如何触发表单校验？
我使用了自定义的表单验证； 例如
上面是我写的校验规则，新建商品的时候没有任何问题但编輯表单时，不会对表单进行校验
我已经把max设置了1，productTitle实际长度是20；必须是表单产生事件的时候才触发这个校验~~~
