vue 导出文件,vue保存文件到本地
这篇文章主要介绍了某视频剪辑软件使用文件保护程序本地文件导出，大家需要安装文件格式和文件保护程序，然后创建localExports.js文件，具体实现代码跟随小编一起看看吧
1:安装xlsx和file-saver
新公共管理安装文件保存程序xlsx -保存
2:创建localExports.js文件
3：直接上代码
从" XLSX "导入XLSX
const file saver=require( file-saver )；
从" @/实用工具"导入{ getRandomNum }；
//本地导出表格
/**
* 导出超过文件
* @param {*} elementName表组件编号名称
* @param {*}文件名文件名
* @描述使用说明
*从" @/utils/localExports "导入{ exportsXlsx }；
* exportsXlsx(idName ，文件名称);
*/
导出函数exportsXlsx(元素名，文件名){
常数时间=新日期()。getTime()；
const random=getRandomNum(100，1000)；
const WB=xlsx。utils。table _ to _ book(clear head(元素名)，{ raw:true })；
const wbout=XLSX.write(wb，{ bookType: xlsx ，bookst:true，type: array })；
文件保护程序。另存为(新Blob([WB out]，{ type: application/octet-stream })，` $ { fileName } $ { time }-$ { random }。xlsx `)；
}
函数clearHead(elementName) {
const tableDom=document。查询选择器( # 元素名).克隆节点(真);
const表头=tabledom。查询选择器(.El-table _ _ header-wrapper )；
const表体=tabledom。查询选择器(.El-table _ _ body’)；
tableHeader.childNodes[0].追加(表体。子节点[1])；
常量标题DOM=表格标题。子节点[0].查询选择器all( th )；
//移除左侧检验盒的节点
if (headerDom[0].querySelectorAll( .el-checkbox)) {
headerDom[0].移除();
}
for(标题DOM中的常量键){
if (headerDom[key].innerText===操作) {
headerDom[key].移除();
}
}
//清理掉检验盒和操作的按钮
常数表列表=表头。子节点[0].子节点[2]。查询选择器all( TD )；
对于(设key=0；密钥表列表。长度；关键){
if (tableList[key].querySelectorAll( .埃尔-复选框)。长度0 tableList[key].querySelectorAll( .埃尔按钮)。长度0) {
tableList[key].移除();
}
}
返回表格标题
}
4：使用方式
埃尔表
id=好
垂直加载=列表加载
:header-cell-style= { background: # FAFAFA ，color: #212532 }
:data=list
工具提示-效果=黑暗
style=宽度：100%
身高=566
边界
@ selection-change= handleSelectionChange
从" @/utils/localExports "导入{ exportsXlsx }；
方法：{
onSearch() {
exportsXlsx(好,模拟数据);
},
}
5:good为table组件的id，getRamdomNum方法如下
//生成随机数
导出函数getRandomNum(最小值，最大值){
定义变量范围=最大-最小；
var Rand=数学。random()；
return(最小数学。round(兰特*范围))；
}
到此这篇关于某视频剪辑软件使用文件保护程序本地文件导出的文章就介绍到这了，更多相关某视频剪辑软件文件保护程序本地文件导出内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。