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 不然页面渲染出来,会复用之前的页面结构,虽然显示了必填星号,但是验证规则不起作用

相关推荐
Amos_Web8 分钟前
通过 Rspack 源码学 Rust(二):所有权、借用与 `&mut`
前端
计算机魔术师15 分钟前
AI公司把「灾难性风险」写进招股书?Anthropic这5处反常
前端
西凉的悲伤15 分钟前
Jsoup 库 HTML 解析详解
java·前端·html·jsoup
niucloud-admin18 分钟前
NIUCLOUD PHP SAAS上门家政使用文档
前端·人工智能·ai编程
不一样的故事12630 分钟前
Prompt 工程(Prompt Engineering)
前端·人工智能·python
ZoeLandia33 分钟前
React08:自定义 Hook
开发语言·前端·react.js·typescript
2601_9499706935 分钟前
msgpackr 跨端三方库仓颉适配全流程
前端·javascript·flutter
Software攻城狮1 小时前
【uniapp和普通web 端开发的区别】
前端·uni-app·notepad++
IT_陈寒1 小时前
Vue项目实战经验分享:动态组件在Keep-Alive下的缓存陷阱
前端·人工智能·后端
数智奔流1 小时前
MiniMax的低价攻势,撞上“背题”疑云
前端·javascript·算法