</el-form-item>
<el-form-item label="上传封面图片" prop="img">
<el-upload
class="upload-demo"
action="http://localhost:8088/common/upload"
:on-success="handleUploadSuccess"
:before-upload="beforeUpload"
:auto-upload="true"
:limit=1
list-type="picture-card">
<img v-if="notice.img" :src="notice.img" class="avatar" style="width: 148px;height: 148px;">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
1.使用elementui在表单中上传图片,效果图如下
action属性:上传后端地址(注意跨域问题)
auto-upload="true"属性:表示点击上传之后会向后端发送请求
2.Java后端上传,将图片保存在指定文件夹下,返回图片名给前端
3.handleUploadSuccess:图片上传成功后触发,向后端发起请求
4.列表页面展示图片