【VUE】使用elementUI上传组件-提示不存在

使用elementUI上传组件上传图片后,表单验证还是提示不存在

主要是因为组件包的层级比较深,验证取不到值导致

可以通过绑定其他元素获取到值进行验证

比如增加el-checkbox-group元素,将值绑定到它上面

javascript 复制代码
<el-form :model="Form" ref="form" :rules="rules">
      <el-form-item prop='imageUrl'>
        <el-checkbox-group v-model="form.imageUrl" v-show="false"></el-checkbox-group>
        <el-upload
          class="avatar-uploader"
          action="#"
          :show-file-list="false"
          :http-request="handleAvatarSuccess">
          <img v-if="Form.imageUrl" :src="Form.imageUrl" class="avatar">
          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload>
      </el-form-item>
    </el-form>

export default { data() { return { Form: { imageUrl: '' }, rules: { imageUrl: [ { required: true, message: '请上传图片', trigger: 'change' } ], } } },
相关推荐
不要em0啦1 小时前
从0开始学python:简单的练习题3
开发语言·前端·python
老华带你飞1 小时前
电商系统|基于java + vue电商系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot·后端
大猫会长1 小时前
关于http状态码4xx与5xx的背锅问题
前端
喝拿铁写前端1 小时前
AI 驱动前端开发覆盖的能力全景拆解
前端·javascript·人工智能
1024小神1 小时前
确认了,Cloudflare的R2对象存储S3接口api不支持在web端使用
前端
KLW751 小时前
vue v-for 列表渲染指令注意
前端·javascript·vue.js
zhengxianyi5151 小时前
vue 首屏加载优化
前端·javascript·vue.js·nginx·gzip·expires·静态文件缓存
老前端的功夫1 小时前
TypeScript 类型守卫:从编译原理到高级模式
前端·javascript·架构·typescript
未来之窗软件服务2 小时前
幽冥大陆(七十二) 东方仙盟-在线IP归属地自己封装—东方仙盟练气期
前端·javascript·tcp/ip·仙盟创梦ide·东方仙盟·阿雪技术观
QT 小鲜肉2 小时前
【Linux命令大全】001.文件管理之mc命令(实操篇)
linux·运维·服务器·前端·笔记