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

【elementUI】form表单rules没生效

关键原则是: 中的 prop 值必须与验证规则对象中的键名完全一致。对于嵌套属性如 info.modelId,需要在两个地方都指定完整的路径。

<template><el-form:model="editForm"ref="editRef":rules="editFormRules"><el-form-item prop="sceneId":label="t('setting.scene')"><el-select v-model="editForm.sceneId":placeholder="t('common.placeholderSelect')"@change="handleSceneChange"><el-option v-for="item in appStore.envLists":key="item._id":label="item.name":value="item._id"/></el-select></el-form-item><el-form-item prop="info.modelId":label="t('scene.menu.file')"><el-select v-model="editForm.info.modelId":placeholder="t('common.placeholderSelect')"><el-option v-for="item in modelOptions":key="item.modelId":label="item.modelName":value="item.modelId"/></el-select></el-form-item><el-form-item prop="type":label="t('common.type')"><el-select v-model="editForm.type":placeholder="t('common.placeholderSelect')"><el-option v-for="type in robotTypes":key="type.value":label="type.label":value="type.value"/></el-select></el-form-item><el-form-item prop="info.sn":label="t('robot.robot_no')"><el-input v-model="editForm.info.sn"/></el-form-item><el-form-item prop="info.name":label="t('robot.robot_name')"><el-input v-model="editForm.info.name"/></el-form-item><el-form-item><el-button @click="handleCancle">{{t('common.cancel')}}</el-button><el-button type="primary"@click="submitForm">{{t('common.save')}}</el-button></el-form-item></el-form></template><script setup lang="jsx">consteditForm=ref({sceneId:undefined,type:undefined,info:{sn:undefined,name:undefined,modelId:undefined,},});// 模型选择框constmodelOptions=ref([]);letrobotTypes=dictStore.ROBOT_TYPES;consteditFormRules=ref({'sceneId':[{required:true,message:t('rules.isRequired'),trigger:'change'}],'info.modelId':[{required:true,message:t('rules.isRequired'),trigger:'change'}],type:[{required:true,message:t('rules.isRequired'),trigger:'change'}],'info.sn':[{required:true,message:t('rules.isRequired'),trigger:'blur'}],});consteditRef=ref(null);
http://www.cnnetsun.cn/news/114727.html

相关文章:

  • Flutter工程化与协作实践指南
  • Excel技巧:提取身份证号码中的出生年月日
  • 软工毕业设计创新的开题分享
  • Oracle数据库物理备份与恢复实战指南
  • 告别“养死”魔咒!AI+知识库+物联网,打造零失败智能种植系统(附架构图+实操指南)
  • 安卓基础之《(4)—Activity组件(2)》
  • 打破数据堵点:6 大主流CRM厂商全链路数据流转能力横评与选型指南
  • 小程序毕设项目:基于springboot+微信小程序的校园活动管理系统设计与实现(源码+文档,讲解、 调试运行,定制等)
  • 小程序毕设项目:基于springboot+微信小程序的DIY电脑推荐与交流平台(源码+文档,讲解、 调试运行,定制等)
  • 小程序毕设项目:基于springboot+微信小程序的在线复习小程序(源码+文档,讲解、 调试运行,定制等)
  • 安徽做SCARA机器人的公司有哪些?
  • 【JavaWeb】MVC模式_理论简介
  • 【JavaWeb】日程管理01——登录页及数据校验功能
  • springboot中File默认路径
  • 【2025年AI 编程时代的热点】
  • 【C++ 笔记】从 C 到 C++:核心过渡 (中)
  • SQL约束解析
  • 地铁调研12-17
  • 现代软件测试工具全景对比与选型指南
  • 基于 Apache POI 的体检报告 Word 生成实战文档
  • org.jetbrains.annotations的@Nullable 学习
  • 计算机毕业设计springboot计算机硬件自配系统 基于Spring Boot的计算机硬件配置管理系统设计与实现 Spring Boot架构下的计算机硬件自选系统开发
  • 【信创】中间件对比
  • 傅里叶变换小波变换
  • 智能桑拿房首选:水管家集成系统如何提升体验?
  • 最简单的LangChain和RAG
  • 空压机监控运维管理系统方案
  • 实习面试题-Rust 面试题
  • 视频字幕精确生成方法 用到字幕api开发文档
  • React Fiber 架构解析:如何利用 `requestIdleCallback` 实现时间切片(Time Slicing)