<el-card>
<avue-crud ref="crud"
:option="fileOption"
:data="dataCRUD"
:page.sync="page"
:search.sync="search"
@current-change="currentChange"
@size-change="sizeChange"
@search-reset="searchReset"
@search-change="searchChange">
<template slot-scope="scope" slot="menu">
<el-button type="text" size="small"@click="handleDownload(scope.row)">下载
</el-button>
</template>
</avue-crud>
<el-card/>
// 下载
handleDownload(row){
console.log(row,'row')
let index = row.name.lastIndexOf(".");
let Type = row.name.substr(index + 1, row.name.length);
console.log(index,Type,'index')
// window.open(row.url)
fileLinkToStreamDownload(row.url, row.name, Type)
},
js文件中的方法,记得要导入以下两个方法
import axios from 'axios';
import FileSaver from "file-saver";
// 文件下载
// url文件路径,fileName文件名称,type文件格式
export function fileLinkToStreamDownload(url, fileName,type) {
axios({
url: url, // 服务器上路径
method: 'get',
responseType: 'blob'
}).then(res => {
console.log(res.data)
const blob = new Blob([res.data], { type: `application/${type};charset=utf-8` }) // 此处type根据你想要的
FileSaver.saveAs(blob, fileName) // 下载的name文件名
}).catch(err => {
console.log(err)
})
}