antd formItem 表单验证

Sherry Tian

已于 2024-01-26 11:22:11 修改

阅读量1k

点赞数 7

CC 4.0 BY-SA版权

分类专栏： ant-design-vue项目实战文章标签： javascript 前端 anti-design-vue

于 2024-01-19 21:52:44 首次发布

本文链接：https://blog.youkuaiyun.com/misstianyun/article/details/135707473

单行展示两个字段，都需要必填验证，formItem一个label对一个字段，默认的排版不足以满足需求，经过思考，稍加变通一下，实现效果如下：在这里插入图片描述

<a-form-model ref="ruleForm" :model="ruleForm" :rules="rules" v-bind="formItemLayout">
   <a-form-model-item label="集装箱号段" prop="code">
     <a-row>
       <a-col :span="10">
         <a-form-model-item prop="codeStart" style="margin-bottom: 0 !important">
           <a-input v-model="ruleForm.codeStart" autocomplete="off