本文介绍了如何在Django后端与ElementUI前端实现文件上传功能。前端部分展示了使用ElementUI的样式和JavaScript处理上传前的验证和成功后的处理。后端部分详细解释了接收文件，判断文件类型和大小，并保存到指定路径的过程。同时，文章还提到了使用开发者工具查看请求数据的方法以及后端接口处理form data类型的技巧。
1：导入element
2：前端文件
css：
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
html:
{% comment %} 上传图片 {% endcomment %}
更新社团封面
name="image" {% comment %} 后端接收的参数名 {% endcomment %}
class="avatar-uploader"
action="/show/images/" {% comment %} 上传路由地址 {% endcomment %}
:show-file-list="false"
:on-success="handleAvatarSuccess" {% comment %} 文件上传成功时的钩子 {% endcomment %}
:before-upload="beforeAvatarUpload"> {% comment %} 上传文件之前的钩子，参数为上传的文件 {% endcomment %}
{% comment %} 上传图片 {% endcomment %}
# JS:
var Main = {
data() { </
最低0.47元/天 解锁文章
扫一扫
711
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
