element-ui文件下载(单个)

  1. 单个附件下载
javascript 复制代码
<el-button
      type="text"
      size="small"
      @click.native.prevent="download(scope.row)" >下载</el-button>


export default {
    data() {
        return {
            downloadUrl: 'http://127.0.0.1:8881/XX/XX', // 下载接口
        }
    },
    methods: {
        download(row) { // 单个附件下载
              // 下载附件(form方式)
          const params = {
            fileId: row.dataId,
            fileName: row.fileName,
            attachmentId: row.dataId,
            token: getToken()
          }
          this.postDownloadFile(params, this.downloadUrl)

          // downloadFileByToken({ attachmentId: row.dataId }).then((response) => { // 按钮提交无效
          // })
    },
    postDownloadFile(params, url) {
          const form = document.createElement('form')
          form.style.display = 'none'
          form.action = url
          form.method = 'post'
          document.body.appendChild(form)
          // 动态创建input并给value赋值
          for (const key in params) {
            const input = document.createElement('input')
            input.type = 'hidden'
            input.name = key
            input.value = params[key]
            form.appendChild(input)
          }
          form.submit()
          form.remove() 
        },
    },
}

灵感来自:https://blog.csdn.net/ewl0116/article/details/129879216

相关推荐
覆东流1 天前
Photoshop图形工具组与图层样式
ui·photoshop
集成显卡1 天前
AI取名大师 | uni-app + Wot UI 跟随设备自动切换明暗主题
人工智能·ui·uni-app·外观配色
测试19981 天前
如何用Appium实现移动端UI自动化测试?
自动化测试·软件测试·python·测试工具·ui·职场和发展·appium
jf加菲猫1 天前
第2章 Hello World
开发语言·c++·qt·ui
将编程培养成爱好2 天前
C++ 设计模式《外卖骑手状态系统》
c++·ui·设计模式·状态模式
jf加菲猫2 天前
第1章 认识Qt
开发语言·c++·qt·ui
q***7483 天前
私有化部署DeepSeek并SpringBoot集成使用(附UI界面使用教程-支持语音、图片)
spring boot·后端·ui
paopao_wu3 天前
DeepSeek-OCR实战(03):本地部署+简单UI测试
ui·ocr
lpfasd1234 天前
Valdi:Snapchat 开源的新一代跨平台 UI 框架
ui·开源
九章云极AladdinEdu4 天前
项目分享|告别枯燥命令行,构建终端用户界面的 TypeScript 库
javascript·ui·typescript