element表单中一个el-form-item下多个form-item项校验（循环校验）

最新推荐文章于 2024-03-11 10:53:41 发布

lvan找不到bug

最新推荐文章于 2024-03-11 10:53:41 发布

阅读量2.1w

点赞数 32

分类专栏： Vue 文章标签： vue element ui

本文链接：https://blog.csdn.net/l508742729/article/details/108286071

版权

在Vue和Element UI结合的项目中，遇到一个el-form-item内包含多个子form-item的校验问题。文章介绍了如何实现此类复杂表单的校验逻辑，特别是prop属性的设置方法。

摘要由CSDN通过智能技术生成

在vue+element的项目中，需要对form表单下的一个form item中校验多项数据，如下图：
表单项校验
代码实现（需要注意prop的值）：

<template>
  <el-form :model="form" ref="ruleForm" label-width="100px">
    <el-form-item label="负责人" prop="principal" :rules="rules.principal">
      <el-input v-model="form.principal"></el-input>
    </el-form-item>
    <el-form-item label="活动列表">
      <el-row v-for="(item, index) in form.activities" :key="index" style="margin-bottom: 20px;">
        <el-col