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

相关推荐
এ慕ོ冬℘゜5 小时前
前端实战:Textarea 实时字数计数输入器(带字数限制+UI优化完整源码)
前端·ui
todoitbo9 小时前
让数据看板随时可见:Grafana + cpolar 远程访问实战
ui·网络安全·grafana·数据看板·远程访问
Liknana10 小时前
Qt 圆角表格控件实战:setMask + 抗锯齿描边 + 多层阴影
qt·ui
天天进步201510 小时前
UI-TARS 源码解析 #7:Thought + Action 输出格式:GUI Agent 的最小决策闭环
ui
曹牧1 天前
C#:关闭UI,清理线程
开发语言·ui·c#
春卷同学1 天前
HarmonyOS掌上记账APP开发实践第29篇:条件渲染与 ForEach — 动态 UI 的构建策略
ui·华为·harmonyos
小小测试开发2 天前
Midscene.js:14K Stars 视驱 UI 自动化框架,用截图替代 DOM 选择器写测试
javascript·ui·自动化
不吃辣4902 天前
从0-1学习导航页面布局优化和搭建
ui·平面·前端框架
大师兄66682 天前
HarmonyOS7 状态驱动 UI 原理:为什么改了数据视图就变
ui·arkui·实战案例·harmonyos7
不甘平凡的小鸟2 天前
Element-UI记录
javascript·vue.js·ui·elementui