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

相关推荐
dotent·3 小时前
C#基于WPF UI框架的通用基础上位机测试WPF框架
ui·c#·wpf
安卓理事人11 小时前
安卓多种通知ui更新的方式(livedata,rxjava,eventbus等)
android·ui·echarts
半兽先生1 天前
uniapp高性能ui框架uni-ui
ui·uni-app
马剑威(威哥爱编程)1 天前
鸿蒙6开发中,UI相关应用崩溃常见问题与解决方案
ui·华为·harmonyos
ITVV1 天前
元数据 Unity Catalog v0.3.0 UI
ui·元数据
袅沫2 天前
Element-UI 番外表格组件
javascript·vue.js·ui
百锦再3 天前
[特殊字符] HBuilder uni-app UI 组件库全方位对比
android·java·开发语言·ui·rust·uni-app·go
lqj_本人4 天前
鸿蒙与Qt的双线程模型:主线程与UI线程的博弈
qt·ui·harmonyos
南华4 天前
Visual Studio 2022 加载解决方案缓慢
ui
lqj_本人4 天前
鸿蒙原生与Qt混合开发:UI集成与事件处理
qt·ui·harmonyos