el-form对象的对象/对象的数组对象验证|el-form对象的对象/对象的数组对象验证 & label中的空格
一:提交表单,遇到复杂对象结构的验证,比如说:
示例图
1. 对象中包含一个数组,里面有多个对象
文章图片
2. 对象中包含一个对象
文章图片
总结来说:
其他的单纯的对象字段,依旧写在 :rules="rules"
里面,复杂结构的单独写在 el-form-item
标签里
template
/** 对象中的数据对象字段验证
多余代码省略 & 只验证非空
**/
自己封装的组件代码省略...
template
/** 对象中对象字段验证
多余代码省略 & 验证非空+validator & 两个相互影响的字段
其中 TEST_VEHICLE_NO 为车牌验证规则 省略
**/
自己封装的组件代码省略...
自己封装的组件代码省略...
二: label妙用空格 示例图
【el-form对象的对象/对象的数组对象验证|el-form对象的对象/对象的数组对象验证 & label中的空格】
文章图片
为什么会在label中用空格?
图上的样式使用了
两行相类似的字段组件一致,分配的 width
一致, 但由于上面一行有非空验证,导致上下两行无法对齐,个人备受煎熬。由于组件有长有短,不能等分,空格的妙用就出现了!!template
自己封装的组件代码省略...
推荐阅读
- 数字化转型时代的企业数据新基建 | 爱分析报告
- 最好的我们,最好的青春
- 拿走了我的「腰带」,带走了我的心
- 投稿|「烧不动」的爱奇艺选择和解
- 基于MIndSpore框架的道路场景语义分割方法研究
- 3步就能制作漫画头像的机器人,想拥有一个吗()
- 一个好的WordPress主机应具备的10个特征
- Android 面试题(说一下 PendingIntent 和 Intent 的区别)
- Ionicons|Ionicons - Ionic 出品的免费开源、高性能图标库,适用于 web / APP / 桌面应用
- 对原码,反码,补码的一点儿理解。