Home > Web Front-end > JS Tutorial > How to use s-xlsx to import and export Excel files (Part 1)

How to use s-xlsx to import and export Excel files (Part 1)

php中世界最好的语言
Release: 2018-03-12 14:37:29
Original
3264 people have browsed it

This time I will show you how to use s-xlsx to import and export Excel files, and how to use s-xlsx to import and export Excel files. What are the precautions?The following is a practical case, let's come together take a look.

Import function implementation

Download js-xlsx to dist, copy xlsx.full.min.js and introduce it into the page
Then read the file through the FileReader object Use js-xlsx to convert json data
Code implementation (==>example<==)

<!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script>
    </head>
    <body>
        <input type="file"onchange="importf(this)" />
        <p id="demo"></p>
        <script>
            /*
            FileReader共有4种读取方法:
            1.readAsArrayBuffer(file):将文件读取为ArrayBuffer。
            2.readAsBinaryString(file):将文件读取为二进制字符串
            3.readAsDataURL(file):将文件读取为Data URL
            4.readAsText(file, [encoding]):将文件读取为文本,encoding缺省值为&#39;UTF-8&#39;
                         */
            var wb;//读取完成的数据
            var rABS = false; //是否将文件读取为二进制字符串
            function importf(obj) {//导入
                if(!obj.files) {                    return;
                }                var f = obj.files[0];                var reader = new FileReader();
                reader.onload = function(e) {                    var data = e.target.result;                    if(rABS) {
                        wb = XLSX.read(btoa(fixdata(data)), {//手动转化
                            type: &#39;base64&#39;
                        });
                    } else {
                        wb = XLSX.read(data, {                            type: &#39;binary&#39;
                        });
                    }                    //wb.SheetNames[0]是获取Sheets中第一个Sheet的名字
                    //wb.Sheets[Sheet名]获取第一个Sheet的数据
                    document.getElementById("demo").innerHTML= JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) );
                };                if(rABS) {
                    reader.readAsArrayBuffer(f);
                } else {
                    reader.readAsBinaryString(f);
                }
            }            function fixdata(data) { //文件流转BinaryString
                var o = "",
                    l = 0,
                    w = 10240;                for(; l < data.byteLength / w; ++l) o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w, l * w + w)));
                o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w)));                return o;
            }        </script>
    </body></html>
Copy after login

2. Implementation of the export function

Also introduce js-xlsx
Code implementation (==>Example<==)

<!DOCTYPE html><html><head>
    <meta charset="UTF-8">
    <title></title>
    <script src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script></head><body>
    <button onclick="downloadExl(jsono)">导出</button>
    <!--
            以下a标签不需要内容
        -->
    <a href="" download="这里是下载的文件名.xlsx" id="hf"></a>
    <script>
        var jsono = [{ //测试数据
            "保质期临期预警(天)": "adventLifecycle",            "商品标题": "title",            "建议零售价": "defaultPrice",            "高(cm)": "height",            "商品描述": "Description",            "保质期禁售(天)": "lockupLifecycle",            "商品名称": "skuName",            "商品简介": "brief",            "宽(cm)": "width",            "阿达": "asdz",            "货号": "goodsNo",            "商品条码": "skuNo",            "商品品牌": "brand",            "净容积(cm^3)": "netVolume",            "是否保质期管理": "isShelfLifeMgmt",            "是否串号管理": "isSNMgmt",            "商品颜色": "color",            "尺码": "size",            "是否批次管理": "isBatchMgmt",            "商品编号": "skuCode",            "商品简称": "shortName",            "毛重(g)": "grossWeight",            "长(cm)": "length",            "英文名称": "englishName",            "净重(g)": "netWeight",            "商品分类": "categoryId",            "这里超过了": 1111.0,            "保质期(天)": "expDate"
        }];        var tmpDown; //导出的二进制对象
        function downloadExl(json, type) {            var tmpdata = json[0];
            json.unshift({});            var keyMap = []; //获取keys
            //keyMap =Object.keys(json[0]);
            for (var k in tmpdata) {
                keyMap.push(k);
                json[0][k] = k;
            }          var tmpdata = [];//用来保存转换好的json 
                json.map((v, i) => keyMap.map((k, j) => Object.assign({}, {                    v: v[k],                    position: (j > 25 ? getCharCol(j) : String.fromCharCode(65 + j)) + (i + 1)
                }))).reduce((prev, next) => prev.concat(next)).forEach((v, i) => tmpdata[v.position] = {                    v: v.v
                });                var outputPos = Object.keys(tmpdata); //设置区域,比如表格从A1到D10
                var tmpWB = {                    SheetNames: [&#39;mySheet&#39;], //保存的表标题
                    Sheets: {                        &#39;mySheet&#39;: Object.assign({},
                            tmpdata, //内容
                            {                                &#39;!ref&#39;: outputPos[0] + &#39;:&#39; + outputPos[outputPos.length - 1] //设置填充区域
                            })
                    }
                };
                tmpDown = new Blob([s2ab(XLSX.write(tmpWB, 
                    {bookType: (type == undefined ? &#39;xlsx&#39;:type),bookSST: false, type: &#39;binary&#39;}//这里的数据是用来定义导出的格式类型
                    ))], {                    type: ""
                }); //创建二进制对象写入转换好的字节流
            var href = URL.createObjectURL(tmpDown); //创建对象超链接
            document.getElementById("hf").href = href; //绑定a标签
            document.getElementById("hf").click(); //模拟点击实现下载
            setTimeout(function() { //延时释放
                URL.revokeObjectURL(tmpDown); //用URL.revokeObjectURL()来释放这个object URL
            }, 100);
        }        function s2ab(s) { //字符串转字符流
            var buf = new ArrayBuffer(s.length);            var view = new Uint8Array(buf);            for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;            return buf;
        }         // 将指定的自然数转换为26进制表示。映射关系:[0-25] -> [A-Z]。
        function getCharCol(n) {            let temCol = &#39;&#39;,
            s = &#39;&#39;,
            m = 0
            while (n > 0) {
                m = n % 26 + 1
                s = String.fromCharCode(m + 64) + s
                n = (n - m) / 26
            }            return s
        }    </script></body></html>
Copy after login

3. Use Python to convert excel to Json to create test data

Code

import sysimport xlrdimport json 
file =sys.argv[1] 
data = xlrd.open_workbook(file)
table=data.sheets()[0]def haveNoIndex(table):
    returnData=[]
    keyMap=table.row_values(0) 
    for i in range(table.nrows):#row
        tmpmp={}
        tmpInd=0
        for k in table.row_values(i): 
            tmpmp[keyMap[tmpInd]]=k
            tmpInd=tmpInd+1  
        returnData.append(tmpmp);    return json.dumps(returnData,ensure_ascii=False,indent=2)
returnJson= haveNoIndex(table) 
fp = open(file+".json","w",encoding=&#39;utf-8&#39;)
fp.write(returnJson)
fp.close()
Copy after login

Export example The test data already contains a header. If there is no header, you can directly create a value=key ({key:key}) for the key traversing the first piece of data in json and insert it into the first piece of json.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Related reading:

Website using nodejs for introduction

How to add element UI components to Vue

How to create a 1px border effect on the mobile terminal

The above is the detailed content of How to use s-xlsx to import and export Excel files (Part 1). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template