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

相关推荐
黑臂麒麟8 小时前
华为云 DevUI初体验:如何快速入门项目搭建
前端·ui·华为云·devui
灰灰勇闯IT11 小时前
RN核心语法与组件体系:UI布局与基础交互
ui·交互·rn
SEO-狼术11 小时前
Telerik UI for WPF and WinForms 2025 Q4 Crack
ui·wpf
Devlive 开源社区12 小时前
View Shadcn UI v2025.1.4 发布 - 全面拥抱暗黑模式
ui
招风的黑耳14 小时前
Axure设计案例——颜色选择器
ui·axure·颜色选择器
灵感菇_1 天前
Flutter Riverpod 完整教程:从入门到实战
前端·flutter·ui·状态管理
2022.11.7始学前端1 天前
n8n第七节 只提醒重要的待办
前端·javascript·ui·n8n
尤老师FPGA1 天前
使用ZYNQ芯片和LVGL框架实现用户高刷新UI设计系列教程(第四十讲)
ui
成富1 天前
Chat Agent UI,类似 ChatGPT 的聊天界面,Spring AI 应用的测试工具
java·人工智能·spring·ui·chatgpt
小a彤1 天前
Flutter UI 美化与适配技巧详解
flutter·ui