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

相关推荐
雨季66610 小时前
基于设备特征的响应式 UI 构建:Flutter for OpenHarmony 中的智能布局实践
javascript·flutter·ui
Mr Xu_16 小时前
深入分析Element UI Tree组件在本地与生产环境样式差异问题
css·ui·elementui
雨季66616 小时前
构建 OpenHarmony 简易单位换算器:用基础运算实现可靠转换
flutter·ui·自动化·dart
测试199819 小时前
如何使用Appium实现移动端UI自动化测试?
自动化测试·软件测试·python·测试工具·ui·appium·测试用例
雨季66620 小时前
构建 OpenHarmony 简易 BMI 健康指数计算器:用基础数学实现健康自评
javascript·flutter·ui·自动化·dart
●VON20 小时前
Flutter for OpenHarmony:基于选择模式状态机与原子批量更新的 TodoList 批量操作子系统实现
学习·flutter·ui·openharmony·von
晚霞的不甘21 小时前
Flutter for OpenHarmony:从零到一:构建购物APP的骨架与精美UI
前端·javascript·flutter·ui·前端框架·鸿蒙
Yawesh_best1 天前
摆脱命令行!Docker Compose UI + 内网穿透,随时随地管理容器
ui·docker·容器
CappuccinoRose1 天前
React框架学习文档(三)
前端·react.js·ui·数组·标签·属性·jsx
幸福的达哥1 天前
PyQt5多线程UI更新方法
python·qt·ui