AspNetCoreWebApi、Vue文件上传
后台:
public class FileUploadAPI { public IFormFile files { get; set; } public int ProjectId { get; set; } }
[HttpPost] public async Task<IActionResult> Post([FromForm] FileUploadAPI objFile) { string path = @"D:\upload" + "\\Upload\\"; if (objFile.files.Length > 0) { if (!Directory.Exists(path)) { Directory.CreateDirectory(path); } using (FileStream filesStream = System.IO.File.Create(path + objFile.files.FileName)) { objFile.files.CopyTo(filesStream); filesStream.Flush(); } } }
Vue:
data(){ return{ fileList: [] } }
<el-upload class="upload-demo" action="doupload" :before-upload="beforeUpload" ref="newupload" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" accept="application/pdf" :file-list="fileList" multiple > <p class="add-icon"><i class="el-icon-plus"></i></p> <p class="add-text">添加文件</p> </el-upload>
import axios from "axios";
//上传文件 beforeUpload(file) { let fd = new FormData(); fd.append("files", file); fd.append("ProjectId", this.projectId); //添加参数 this.fileList.push({ name: file.name }); this.ProjectArrays.push({ sessionName: file.name }); axios .post("http://localhost:5000/api/ProjectSession/Post", fd) .then(function () { alert("成功"); }); },