el-form中数组嵌套对象的验证
<el-form ref="addData" :model="addData" :rules="addDataRules" label-width="110px" class="add-form pt20 pb10" > <el-row :gutter="100"> <el-col :span="24"> <el-form-item :label="$t('specialityParam.tagName')" prop="tagName" > <el-input v-model.trim="addData.tagName" maxlength="100" size="small" :show-word-limit="true" clearable /> </el-form-item> </el-col> <el-col v-for="(item,idx) in addData.dataList" :key="idx" :span="24"> <el-form-item :label="$t('specialityParam.paramName')":prop="'dataList['+idx+'].paramName'" :rules="addDataRules.dataRules.paramName" > <el-input v-model.trim="item.paramName" width="80%" maxlength="100" size="small" :show-word-limit="true" clearable /> <el-button-group> <el-button icon="el-icon-plus" size="mini" /> <el-button icon="el-icon-close" size="mini" /> </el-button-group> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="24"> <div style="text-align: center;"> <el-button type="primary" size="mini" class="button-operate" @click="handleSubmit()" > {{ $t('base.submit') }} </el-button> <el-button size="mini" class="button-operate" @click="handleCancel" > {{ $t('base.cancel') }} </el-button> </div> </el-col> </el-row> </el-form>
addData: { tagName: '', dataList: [{}] }, addDataRules: { tagName: [ { required: true, message: this.$t('specialityParam.tagName_not_null'), trigger: 'blur' } ], dataRules: { paramName: [ { required: true, message: this.$t('specialityParam.tagName_not_null'), trigger: 'blur' } ] } }
:prop="'dataList['+idx+'].paramName'"
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具