element ui文件上传

elementUI 本身就提供了 文件上传的方法

        <el-upload
          class="upload-demo"
          ref="upload"
          name="file"
          accept=""
          :action="myaction"
          :on-preview="handlePreview"
          :before-upload="updateFileName"
          :on-remove="handleRemove"
          :on-success="handleSuccess"
          :on-progress="handleProgress"
          :file-list="fileList"
          :auto-upload="false"
        >
          <el-button slot="trigger" size="small" type="primary"
            >选取文件</el-button
          >
          <el-button
            style="margin-left: 10px;"
            size="small"
            type="success"
            @click="submitUpload"
            >上传到服务器</el-button
          >
          <div slot="tip" class="el-upload__tip">
            注意！上传的文件不能超过100M
          </div>
        </el-upload>

组件中的 action 属性就是文件上传的后端地址

后端方法：

    @PostMapping("/fileUpLoad")
    public String upload(MultipartFile file) throws SocketException, IOException {
        // 获取文件名
        String fileName = file.getOriginalFilename();
        // 本工程下的路径
        String path=System.getProperty("user.dir")+"\\src\\main\\resources\\static\\upload\\";
        String destFileName= path + fileName;
        File destFile = new File(destFileName);
        // 如果没有就根据地址创建一个
        if(!destFile.exists()){
            destFile.getParentFile().mkdirs();
        }
        // 将文件移动到目的目录
        file.transferTo(destFile);
        return "上传成功";
    }