表格报错原因及解决方案 js导出excel表格兼容性

文章插图
一、SpreadJS 简介SpreadJS 是一款基于 HTML5 的纯 JavaScript 电子表格和网格功能控件，以“高速低耗、纯前端、零依赖”为产品特色，可嵌入任何操作系统，同时满足 .NET、Java、响应式 Web 应用及移动跨平台的表格数据处理和类 Excel 的表格应用开发，为终端用户带来亲切的 Excel 体验。
本文将以 xlsx 文件格式为例，展示如何使用 SpreadJS 实现前端导入和导出excel文件。
SpreadJS 官网本文在线Demo示例导入导出Excel视频演示1. 主要功能
a. 功能、UI 与 Excel 高度类似
b. 兼容 450 种以上的 Excel 公式
c. 符合 UMD 规范，可按需加载
d. 完善的数据可视化，支持形状、图表、迷你图
e. 纯前端导入、导出 Excel 文件
f. 使用 HTML5 图形（Canvas）绘制界面，具备高性能和响应速度
2. 安装包目录结构
├── Spread.Sheets SpreadJS产品包
│ └── Designer SpreadJS 表格设计器
│ ├── Spread.Sheets-Designer.12.0.0.AppImage [Mac]
│ ├── Spread.Sheets-Designer.12.0.0.dmg [Linux]
│ └── Spread.Sheets-Designer.12.0.0 [Windows]
│ └── Spread.Sheets.Docs.12.0.0 SpreadJS 表格接口文档
│ ├── content
│ └── index
│ └──Spread.Sheets.Release.12.0.0 SpreadJS 表格 JavaScript 库/演示用例
│ ├── css 样式文件
│ ├── definition TS 引用文件
│ ├── readme
│ ├── samples 示例代码（包括原生JS,Angular,Vue,React）
│ ├── scripts JS文件
│ ├── GrapeCity-EULA
│ └── LICENSE
3. 如何使用
a. Spread.Sheets不依赖任何第三方组件。它只需要引用下列文件：
gc.spread.sheets.xx.x.x.css，gc.spread.sheets.all.xx.x.x.min.js 。
<link rel=”styleSheet” href=https://www.520longzhigu.com/diannao/”gc.spread.sheets.xx.x.x.css” />
<script src=https://www.520longzhigu.com/diannao/”gc.spread.sheets.all.xx.x.x.min.js” type=”text/javascript”>
<script src=https://www.520longzhigu.com/diannao/”gc.spread.sheets.resources.zh.xx.x.x.min.js” type=”text/javascript”>
b. 在页面的body元素中添加一个DOM元素作为它的容器。
<div id=”ss” style=”width:100%; height:360px;border: 1px solid gray;”></div>
c. 用代码“new GC.Spread.Sheets.Workbook(document.getElementById(‘ss’), { sheetCount: 1 })”来初始化Spread 。
window.onload = function () {
var spread = new GC.Spread.Sheets.Workbook(document.getElementById(‘ss’), { sheetCount: 1 });
};
d. 初始化 SpreadJS 在线示例
二、前端导入导出Excel实现前端导入导出只需要引入 gc.spread.excelio 库，使用 excelIO.open 和 excelIO.save 两个方法即可，不需要配置任何选项，代码十分简洁易懂。
具体步骤如下：
前端导入导出支持将 Spread json 导出为excel文件(.xlsx)和将 excel 文件导入为 Spread json.
使用前端导入导出, 你需要将相关的js文件添加的 document 的 head 区域。例如:<head>
…
<script src=https://www.520longzhigu.com/diannao/’…/spreadjs/gc.spread.sheets.all.x.xx.xxxxx.x.min.js’ type=’text/javascript’>
<script src=https://www.520longzhigu.com/diannao/’…/spreadjs/plugins/gc.spread.excelio.x.xx.xxxxx.x.min.js’ type=’text/javascript’>
</head>
初始化 Workbook 实例和 ExcelIO 实例：var spread = new GC.Spread.Sheets.Workbook(document.getElementById(‘ss’));
var excelIo = new GC.Spread.Excel.IO();
接下来你就可以使用 open 方法将 excel 文件导入为 spread json，使用 save 方法将 spread json 导出为excel文件。例如://import excel file to Spread.Sheets json

以上关于本文的内容，仅作参考！温馨提示：如遇健康、疾病相关的问题，请您及时就医或请专业人士给予相关指导!

「四川龙网」www.sichuanlong.com小编还为您精选了以下内容，希望对您有所帮助：