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

相关推荐
XPii2 小时前
Photoshop应用——将图片变为素描效果
ui·photoshop
雨季6663 小时前
构建 OpenHarmony 文本高亮关键词标记器:用纯字符串操作实现智能标注
开发语言·javascript·flutter·ui·ecmascript·dart
雨季6665 小时前
构建 OpenHarmony 应用内消息通知模拟器:用纯 UI 演示通知流
flutter·ui·自动化·dart
UI设计兰亭妙微7 小时前
兰亭妙微:以HTML前端、UI/交互/图标设计赋能数字孪生与大屏设计新标杆
前端·ui·用户体验设计
信徒favor20 小时前
我用AI一次性生成3种UI原型(附提示词)
ui
ll_god1 天前
android compose ui 结合 ViewModel适配方案
android·ui
SoraLuna1 天前
KuiklyUI for OpenHarmony 实战 01:源码构建与运行(Mac)
macos·ui·鸿蒙
雨季6661 天前
构建交互式响应式页面:Flutter 在 OpenHarmony 上的动态 UI 实践
flutter·ui
紫雾凌寒1 天前
【 HarmonyOS 高频题】2026 最新 ArkUI 开发与组件面试题
ui·华为·面试·程序员·职场发展·harmonyos·ark-ui
bugcome_com1 天前
WPF 数据模板(DataTemplate):优雅实现数据与 UI 的解耦
ui·wpf