当前位置: 首页 > news >正文

for循环遍历的`form表单组件`rules规则校验失效问题——下拉框选择之后还是报红---亲测有效

问题:   大概的效果就是这种, for循环选择之后还是还是报红

看文章之前 :  先检查  model  rules pops 有没有判定好

解决:    参考了他的 for循环遍历的`form表单组件`rules规则校验失效问题——输入内容后依然提示必填,亲测有效——基础积累_a-form-model的validatefield方法循环遍历校验失效_叶浩成520的博客-CSDN博客

 这样我要绑定的数据 

出现的原因是因为 ,  formData.authorizedUser  是一个数组,不能直接点对象   ,所以需要带上索引   1.  :prop="'authorizedUser.' + index + '.rid'"  这种格式

2.  :rules="rules.uid"   

这两点很重要

<div v-for="(user, index) in formData.authorizedUser" :key="index"><el-form-item :prop="'authorizedUser.' + index + '.uid'" :rules="rules.uid" label="用户分配"label-width="120px"><el-select v-model="user.uid" filterable placeholder="请选择用户,可搜索" clearable><el-option v-for="item in realUserList" :key="item.id" :value="item.id":label="`${item.nickName || ''} - ${item.depart || ''} - ${item.postName || ''}`"></el-option></el-select></el-form-item><el-form-item :prop="'authorizedUser.' + index + '.rid'" :rules="rules.rid" label="角色分配"label-width="120px"><el-select v-model="user.rid" filterable placeholder="请选择角色" clearable><el-option v-for="item in planRoleList" :key="item.id" :value="item.id":label="item.titleName"></el-option></el-select></el-form-item><el-form-item :prop="'authorizedUser.' + index + '.did'" :rules="rules.did" label="被盘点部门"label-width="120px"><el-select v-model="user.did" filterable placeholder="请选择被盘点部门" clearable><el-option v-for="item in filteredData" :key="item.deptId" :value="item.deptId":label="item.deptName"></el-option></el-select></el-form-item>

http://www.lryc.cn/news/195936.html

相关文章:

  • 【Python数据分析工具】
  • Python数据挖掘入门进阶与实用案例:自动售货机销售数据分析与应用
  • 2.3_9吸烟者问题
  • 位运算基础知识及性质(精简总结)
  • 阵列信号处理_对比常规波束形成法(CBF)和Capon算法
  • 通过循环生成多个echarts图表并实现自适应
  • MySQL——六、库表操作(下篇)
  • 自动化办公篇之python批量改名
  • Android MediaCodec将h264实时视频流数据解码为yuv,并转换yuv的颜色格式为nv21
  • Postgresql SQL 字段拼接
  • MySQL 迁移完不能快速导数据了?
  • Lazysysadmin靶机
  • LeetCode09——回文数
  • 云安全—分布式基础
  • Spring(18) @Order注解介绍、使用、底层原理
  • 目标检测YOLO实战应用案例100讲-基于改进YOLOv6的轧钢表面细小缺陷检测
  • leetcode:507. 完美数(python3解法)
  • 智能物联网解决方案:蓝牙IOT主控模块打造高效监测和超低功耗
  • vue 拿到数据后,没有重新渲染视图,nuxt.js拿到数据后,没有重新渲染视图,强制更新视图
  • Docker基础操作命令演示
  • XTU-OJ 1175-Change
  • Python环境安装
  • 苏轼在密州的四首千古名作
  • [计算机提升] 域及域用户(组)
  • 命令行配置文件
  • MPP产品介绍-定位-应用场景-技术特点
  • Linux性能优化--性能工具:磁盘I/O
  • Archive Team: The Twitter Stream Grab
  • Vue-props配置功能
  • iMazing 3中文版功能介绍免费下载安装教程