vue中使⽤file-saver导出⽂件
⼀、安装
# Basic Node.JS installation
npm install file-saver --save
bower install file-saver
此外，可以通过以下⽅式安装TypeScript定义：
# Additional typescript definitions
npm install @types/file-saver --save-dev
⼆、语法
saveAs()从⽂件保存器导⼊
import { saveAs } from 'file-saver';
FileSaver saveAs(Blob/File/Url, optional DOMString filename, optional Object { autoBom })
传递{ autoBom: true }如果你想FileSaver.js⾃动提供Unicode⽂本编码提⽰（：见）。请注意，只有在您的Blob类型已charset=utf-8设置的情况下才能执⾏此操作。
三、例⼦
使⽤保存⽂字 require()
var FileSaver = require('file-saver');
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
FileSaver.saveAs(blob, "");
储存⽂字
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
FileSaver.saveAs(blob, "");
保存⽹址
FileSaver.saveAs("/image", "image.jpg");
在相同来源内使⽤URL只会使⽤a[download]。否则，它将⾸先检查它是否⽀持带有同步头请求的cors标头。如果是这样，它将下载数据并使⽤Blob URL保存。如果没有，它将尝试使⽤下载它a[download]。
标准的W3C File API 接⼝并⾮在所有浏览器中都可⽤。 是Blob解决此问题的跨浏览器实现。
保存画布
import FileSaver from "file-saver";
export default class fileSave {
/**
* 导出Excel⽂件
* @param {*} res  ⽂件流
* @param {*} name  ⽂件名
*/
static getExcel(res, name) {
let blob = new Blob([res], {
type: "application/vnd.ms-excel"
});
FileSaver.saveAs(blob, name + ".xlsx");
}
/**
* 导出CSV⽂件
* @param {*} res  ⽂件流
getsavefilename
* @param {*} name  ⽂件名
*/
static getCsv(res, name) {
let blob = new Blob([res], {
type: "application/vnd.ms-excel"
});
FileSaver.saveAs(blob, name + ".csv");
}
/**
* 导出图⽚1
* @param {*} url 图⽚地址
* @param {*} name  ⽂件名
*/
static getImgURLs(url, name) {
let last = url.substring(url.lastIndexOf("."), url.length);        FileSaver.saveAs(url, `${name}${last}`);
}
/**
* 导出图⽚2
* @param {*} res ⽂件流
* @param {*} name  ⽂件名
*/
static downLoadImg(res, filename) {
let blob = new Blob([res], {
type: "image/jpeg"
});
FileSaver.saveAs(blob, `${filename}.jpg`);
}
}
使⽤：
1.导⼊
import exportFile from '@/utils/exportFile'
2.使⽤

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。