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("成功");
        });
    },

 

posted @ 2022-02-16 15:48  点终将连成线  阅读(293)  评论(0编辑  收藏  举报