v-if 遇到 el-form 表单验证规则遇到的bug

v-if 遇到 el-form 表单验证规则遇到的bug

需求:当表单项中的单选框选择 是 的时候,上传图片组件为必填项

vue 复制代码
     <el-form-item
          label="展示图"
          prop="displayImage"
          v-if="dengmiQueryForm.isRecommend == 0"
          key="hasRules"
        >
          <ImageUpload
            :limit="1"
            :fileSize="2"
            ref="imageUploadRef2"
            :value="imgList2"
          />
        </el-form-item>

        <el-form-item label="展示图" v-else key="noRules">
          <ImageUpload
            :limit="1"
            :fileSize="2"
            ref="imageUploadRef2"
            :value="imgList2"
          />
        </el-form-item>

特别注意:需要添加 key 不然页面渲染出来,会复用之前的页面结构,虽然显示了必填星号,但是验证规则不起作用

相关推荐
Dorcas_FE38 分钟前
【tips】动态el-form-item中校验的注意点
前端·javascript·vue.js
小小前端要继续努力42 分钟前
前端新人怎么更快的融入工作
前端
四岁爱上了她1 小时前
input输入框焦点的获取和隐藏div,一个自定义的下拉选择
前端·javascript·vue.js
fouryears_234171 小时前
现代 Android 后台应用读取剪贴板最佳实践
android·前端·flutter·dart
boolean的主人1 小时前
mac电脑安装nvm
前端
用户1972959188911 小时前
WKWebView的重定向(objective_c)
前端·ios
烟袅1 小时前
5 分钟把 Coze 智能体嵌入网页:原生 JS + Vite 极简方案
前端·javascript·llm
18你磊哥1 小时前
Django WEB 简单项目创建与结构讲解
前端·python·django·sqlite
KangJX1 小时前
iOS 语音房(拍卖房)开发实践
前端·前端框架·客户端
神秘的猪头2 小时前
🧠 深入理解 JavaScript Promise 与 `Promise.all`:从原型链到异步编程实战
前端·javascript·面试