zoukankan      html  css  js  c++  java
  • 前端导出功能实现--csv文件格式

    记录一下前端导出文件的功能,目前该功能仅支持导出csv文件格式,如下是function:

    function exportCvs(com,model,param){
                var title = storageObj.title;
                var titleForKey = storageObj.titleForKey;
                var data = storageObj.data;
                var str = [];
                str.push(storageObj.title.join(",")+"
    ");
                for(var i=0;i<data.length;i++){
                    var temp = [];
                    for(var j=0;j<titleForKey.length;j++){
                        temp.push(data[i][titleForKey[j]]);
                    }
                    str.push(temp.join(",")+"
    ");
                }
                var uri = 'data:text/csv;charset=utf-8,ufeff' + encodeURIComponent(str.join(""));
                var downloadLink = document.createElement("a");
                downloadLink.href = uri;
                downloadLink.download = new Date().toISOString().substring(0,10)+"-labelDetail.csv";
                document.body.appendChild(downloadLink);
                downloadLink.click();
                document.body.removeChild(downloadLink);
    };

    参数com、model、param没有使用,可以不传递数据。
    storageObj为一个Object对象,格式如下所示:
    var storageObj = {
    title:[“时间”,”label名称”, “点击次数”],
    titleForKey:[“labelTime”, “labelName”, “labelCount”],
    data:[]
    };
    titile是第一行的说明行,titleForKey的数组数量与title一致。
    data是一个对象数组,基本的格式为:

    [{
        "labelTime":"value1",
        "lableName":"value2",
        "labelCount":"value3"
    },{
        "labelTime":"value4",
        "lableName":"value5",
        "labelCount":"value6"
    },{
        "labelTime":"value7",
        "lableName":"value8",
        "labelCount":"value9"
    }] 

    数据的添加可以采用storageObj.data数组对象动态添加。
    最后导出的csv文件的格式如下图所示:
    export csv file

    学习、成长
  • 相关阅读:
    eventkeyboardmouse
    代理 IP
    网关 192.168.2.1 114.114.114.114 dns查询
    http ssl
    SSDP 抓包
    抓包登录信息提交
    危险的input 微博的过去
    firstChild.nodeValue
    浏览器控制台
    haproxy 中的http请求和https请求
  • 原文地址:https://www.cnblogs.com/yarcl/p/11046767.html
Copyright © 2011-2022 走看看