el-upload通过action指定后端接口,并通过name指定传输的文件包裹在什么变量名中
javascript
<el-upload
class="upload-demo"
drag
action="https://ai.zscampus.com/toy/upload"
multiple
name="fileList"
:limit="10"
accept=".xlsx, .xls, .txt, .csv, .docx, .pdf, .pptx, .html"
>
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
<div class="cm-upload-text">
点击或拖动文件到此处上传
</div>
<div class="el-upload__tip">
支持 .txt, .docx, .csv, .xlsx, .pdf, .html, .pptx 类型文件
</div>
<div class="el-upload__tip">
最多支持 10 个文件。单个文件最大 500 MB。
</div>
</el-upload>
后端代码用FastAPI来写,注意:从request中取出来的变量名要和el-upload中的name指定的变量名保持一致
python
@router.post("/uploadMaterial")
async def uploadMaterial(fileList: List[UploadFile] = File(...)):
writeBytes("./upload",fileList)
return {
'code':200,
"msg":'success'
}
# 将file写入dirs目录文件
def writeBytes(dirs,fileList):
for file in fileList:
bytesFile=file.file.read()
filename="{}_{}".format(getRandomID(),file.filename)
if not os.path.exists(dirs):
os.makedirs(dirs)
with open(dirs+'/'+ filename, "wb") as f:
f.write(bytesFile)