zoukankan      html  css  js  c++  java
  • js 下载文件流

    <template>
      <div class="expand-notes" id="attachment">
        <div>
          <h4 class="h-list step7">attachment Download | 附件下载 </h4>
        </div>
        <!--附件下载-->
        <div class="language">
          <el-table :data="filelist" border style=" 100%">
            <el-table-column prop="fileName" align='center' label="文件名称">
            </el-table-column>
            <el-table-column fixed="right" label="操作" align='center'>
              <template slot-scope="scope" >
                <el-button size="small"  type="primary" plain @click="downloadfiles(scope.row)" :loading="scope.row.isloading">{{scope.row.isloading ? "下载中..." : "下载" }}</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </template>
    
    <script>
    import { downloadfilelist} from '@/api';
    export default {
      name: 'attachment',
      props:{
        filelist:{
          type:Array,
          default:()=>{
            return []
          }
        }
      },
      data () {
        return {}
      },
      methods: {
        downloadfiles(rows){
          rows.isloading = true;
          downloadfilelist(rows.id).then(res => {
              const content = res.data;
              const blob = new Blob([content])
              const filename = rows.fileName;
              if('download' in document.createElement('a')) {
                const elink = document.createElement('a')
                elink.download = filename
                elink.style.display = "none"
                elink.href = URL.createObjectURL(blob)
                document.body.appendChild(elink)
                elink.click();
                URL.revokeObjectURL(elink.href)
                document.body.removeChild(elink)
              } else {
                navigator.msSaveBlob(blob, filename)
              }
            }).catch(err=>{
              this.$message.error(err ||'下载失败,请稍后再试!');
            })
            .finally(()=>{
               rows.isloading = false;
            })
        }
      }
    }
    </script>
    

      

  • 相关阅读:
    C++静态库与动态库(转)
    Tornado异步
    Yacc与Lex
    云数据库
    linux如何查看端口被谁占用
    Innodb Double Write
    MySQL GTIDs(global transaction identifiers)
    Java并发编程:线程池的使用
    Oracle 建立索引及SQL优化
    解决redhat linux下IP地址可以ping通,域名无法ping通问题
  • 原文地址:https://www.cnblogs.com/qq735675958/p/12955710.html
Copyright © 2011-2022 走看看