el自定义上传显示原有进度条

qq_44374388

已于 2022-09-19 17:28:04 修改

阅读量245

点赞数

文章标签：前端 javascript 开发语言 vue

于 2022-09-19 17:26:16 首次发布

本文链接：https://blog.csdn.net/qq_44374388/article/details/126938116

版权

el自定义上传显示原有进度条

export function mpupload(data,param) {
    return request({
        url: '/gvc/bosFile/addContentFile/' + localStorage.getItem("userId"),
        headers: {
            'Content-Type': 'multipart/form-data'
        },
        method: 'post',
        data: data,
        onUploadProgress: (progressEvent) => {
            let num = ((progressEvent.loaded / progressEvent.total) * 100) | 0; //百分比
            param.onProgress({ percent: num }); //进度条
        }
    })
}

async submites(params, type) {
      var filelist = new FormData();
      //添加参数
      filelist.append("file", params.file);
      filelist.append("userId", localStorage.getItem("userId"));
      filelist.append("type", 1);
      await mpupload(filelist,params)
        .then((res) => {
          this.ruleForm.fileBookList = res.message;
          this.$modal.msgSuccess("视频上传成功");
        })
        .catch((err) => {
          this.$message.error("上传文件失败，请联系管理员");
          this.lod = false;
        });
    },