给循环数组里的每个对象做表单校验

最新推荐文章于 2025-03-25 14:25:01 发布

指标满载

最新推荐文章于 2025-03-25 14:25:01 发布

阅读量1.5k

点赞数

文章标签：数组校验校验

本文链接：https://blog.youkuaiyun.com/weixin_44770377/article/details/107537162

版权

本文介绍如何在表单中对循环数组内的每个对象进行身份证和电话号码的校验。区别于静态的单对象表单校验，数组对象的prop需要动态拼接，如：:prop="‘peersList.’ + index +’.idcard’"，确保能够正确校验数组内的每一项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需求是需要对下面循环产生的数组中的每行身份证和电话号码做校验规则
在这里插入图片描述

和单表单对象校验不同的是prop而已。单对象表单prop是写死的。当数组中的对象校验时，数组外层用el-form包裹，里面循环产生的对象prop要用动态拼接的方式，如：:prop="‘peersList.’ + index +’.idcard’"。

<el-form  :model="ruleForm"  ref="peerForm" class="peersList" >
  <el-row v-for="(row,index) in ruleForm.peersList" :key="index">
    <el-col :span="1" align="center" style="margin-left: 10px;">
      <span>{
  {index+1}}</span>
    </el-col>
    <el-col :span="4" style="margin-left: 10px;">
      <el-form-item :prop="'peersList.' + index +'.name'">
        <el-input v-model="row.name" placeholder="姓名"></e

最低0.47元/天解锁文章