vue+element 中表单提交el-form+上传组件el-upload

最新推荐文章于 2025-07-09 14:23:59 发布

原创

最新推荐文章于 2025-07-09 14:23:59 发布 · 2.6w 阅读

78 ·

CC 4.0 BY-SA版权

文章标签：

#上传图片 #上传文件 #el-upload #本地预览 #表单提交

个人blog，欢迎关注加收藏

页面效果
html代码：弹框：表单中包含图片上传的组件el-upload

//html
 <!-- 弹框 -->
    <div class="dialog">
      <el-dialog :title="formTitle" :visible.sync="dialogFormVisible">
        <el-form :model="form">
          <el-form-item label="图标" label-width="7.5rem">
            <!-- :data="upLoadData" -->
            <el-upload class="avatar-uploader" 
            action="111"   //这里随便写，反正用不到，但是又必须要写，无奈
            :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
              <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-item label=