JavaScript将array数据下载到Excel中

具体代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdn.jsdelivr.net/npm/xlsx/dist/xlsx.full.min.js"></script>
    <script src="https://cdn.bootcss.com/FileSaver.js/2014-11-29/FileSaver.js"></script>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <title>下载Excel</title>
</head>
<body>
    <button onclick="downloadfile()">下载Excel</button>
    <script>
        function downloadfile() {
            
            var workbook = XLSX.utils.book_new(); //这段代码创建了一个名为的Workbook对象。
            console.log(workbook)
            var ws = XLSX.utils.json_to_sheet([]); //创建一个工作表对象
            var ws1 = XLSX.utils.json_to_sheet([]); //创建一个工作表对象
            XLSX.utils.book_append_sheet(workbook,ws,"ph数据"); //将工作表添加到workbook对象中
            XLSX.utils.book_append_sheet(workbook,ws1,"test"); //将工作表添加到workbook对象中

            workbook.creator = 'test123'  //创建者
            workbook.created = new Date()  //创建时间

            var data = [

                {"bz":"","cqqk":"/","date":"2023-01-04","djperson":"zs","id":1,"name":"2#","ph":5.8},{"bz":"","cqqk":"/","date":"2023-01-04","djperson":"zs","id":2,"name":"3#","ph":5.06}
            ]
            var jsonDataWithHeaders = [
                { "header1": "value1", "header2": "value2" },
                { "header1": "value3", "header2": "value4" }
                ];
            var datas = []
            for(var i = 0;i < data.length; i++){
                var p = {"id":data[i].id,"date":data[i].date,"name":data[i].name,"ph":data[i].ph,"cqqk":data[i].cqqk,"djperson":data[i].djperson,"bz":data[i].bz}
                datas.push(p)
            }
            //
            //将数据添加到工作表
            XLSX.utils.sheet_add_json(ws,datas,{skipHeader:false,origin:"A1"})
            XLSX.utils.sheet_add_json(ws1,jsonDataWithHeaders,{skipHeader:true,origin:"A2"})
            var date = new Date();
            var isoString = '导出数据'+ date.toISOString().slice(0,10);
            // console.log(p);
            // const date = new Date();
            // // 获取年份
            // const year = date.getFullYear().toString();    
            // // 获取月份,月份从0开始,需要加1
            // const month = (date.getMonth() + 1).toString(); 
            // // 获取日期
            // const day = date.getDate().toString();
            // 获取小时
            const hours = date.getHours().toString().padStart(2, '0');
            // 获取分钟padStart(2, '0')在前面补0
            const minutes = date.getMinutes().toString().padStart(2, '0');
            // 获取秒数
            const seconds = date.getSeconds().toString().padStart(2, '0');
            var sfm = hours+':'+minutes+':'+seconds
            var names = isoString+' '+sfm+'.xlsx'
            console.log(names);
            //导出Excel文件
            XLSX.writeFile(workbook,names)
        }
    </script>
</body>
</html>

这个建了一个Excel表,两个sheet,分别存放了一定的数据,最后进行下载下来,其中skipHeader:false,origin:"A1"代表不省略表头,表头默认是字典中的keys,从A1行开始:

如果你想要将 Vue 数据存放到一个已有的 Excel 模板,可以按照以下步骤进行操作: 1. 安装依赖:`npm install -s file-saver xlsx` 2. 在 Vue 组件引入依赖: ```javascript import { saveAs } from 'file-saver'; import XLSX from 'xlsx'; ``` 3. 读取 Excel 模板: ```javascript // 读取Excel模板文件 const xhr = new XMLHttpRequest(); xhr.open('GET', 'path/to/template.xlsx', true); xhr.responseType = 'arraybuffer'; xhr.onload = function () { if (this.status === 200) { const data = new Uint8Array(this.response); const workbook = XLSX.read(data, { type: 'array' }); const worksheet = workbook.Sheets['Sheet1']; // 操作Excel数据 // ... // 将Excel数据保存到本地 // ... } }; xhr.send(); ``` 在上述代码,`XMLHttpRequest` 对象可以用于向服务器发送请求并获取数据,`XLSX.read` 函数可以将二进制数组转换为 Excel 工作簿,`workbook.Sheets['Sheet1']` 可以获取工作簿名为 `Sheet1` 的工作表。你需要将 `path/to/template.xlsx` 替换为你的 Excel 模板文件路径。 4. 操作 Excel 数据: ```javascript // 操作Excel数据 worksheet.A1.v = 'John Doe'; worksheet.B1.v = 30; worksheet.A2.v = 'Jane Doe'; worksheet.B2.v = 25; ``` 在上述代码,`worksheet.A1.v` 表示工作表 A1 单元格的值,你可以通过修改这个值来改变 Excel 数据,`worksheet.B1.v` 表示工作表 B1 单元格的值,以此类推。 5. 将 Excel 数据保存到本地: ```javascript // 将Excel数据保存到本地 const excelBuffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' }); const file = new Blob([excelBuffer], { type: 'application/octet-stream' }); saveAs(file, 'example.xlsx'); ``` 在上述代码,`XLSX.write` 函数可以将工作簿转换为二进制数组,`Blob` 函数可以将二进制数组转换为文件对象,`saveAs` 函数可以将文件保存到本地。你可以根据自己的需求修改文件名。 希望这个方法对你有所帮助!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值