# fgc-spread-lib

**Repository Path**: low-code-dev-lab/fgc-spread-lib

## Basic Information

- **Project Name**: fgc-spread-lib
- **Description**: 本工程提供了一个活字格低代码平台与 SpreadJS 整合的标准解决方案，方案基于 vite 进行实现，编译后的类库可在活字格设计器中应用与 SpreadJS 相关开发，您也可以选择其他的构建工具进行实现。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-12-03
- **Last Updated**: 2025-12-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# fgc-spread-lib

本工程提供了一个活字格低代码平台与 SpreadJS 整合的标准解决方案，方案基于 vite 进行实现，编译后的类库可在活字格设计器中应用与 SpreadJS 相关开发，您也可以选择其他的构建工具进行实现。

本工程对应的活字格侧的应用请访问[Excel模板填报](https://gitee.com/low-code-dev-lab/hzg-demo-spread-lib)

## Getting start

1. 构建工程，生成类库源码。
  ```bash
  npm run build
  ```
2. 将 dist 目录下生成的 `fgc-spread-lib.js` 文件与 `fgc-spread-lib.css` 文件导入到活字格工程中。
3. 在活字格中可直接编写 js 代码进行 SpreadJS 初始化。需要确保使用的 SpreadJS 命名空间为工程源码中定义的空间名称。

  > 工程默认的命名空间名称为 `MYGC`。

## 整合原理

由于活字格本体中已经存在 SpreadJS 的相关依赖。因此，在相同的 `GC` 命名空间中，会存在活字格的逻辑与 SpreadJS 逻辑的兼容性问题。因此，我们需要修改外部引入的 SpreadJS 的命名空间，从而避免 API 冲突。

所以在入口文件`main.js`中，将默认的 `GC` 对象重重新挂载到自定义的 `MYGC` 上（该名称可以自行修改，但请确保活字格中初始化 Spread 对象时要匹配）。

```js
window.MYGC = GC;
```

在活字格中的 js 逻辑中直接初始化：

```js
const spreadJSDiv = document.querySelectorAll('.spreadDiv');
if(spreadJSDiv.length > 0) {
  spreadJSDiv[0].innerHTML= "";
  let designer = new MYGC.Spread.Sheets.Designer.Designer(spreadJSDiv[0]);
  var spread = designer.Spread;
}
```

## 其他资源

- [葡萄城市场](https://marketplace.grapecity.com.cn)
- [活字格低代码开发平台](https://www.grapecity.com.cn/solutions/huozige)
- [SpreadJS - 可嵌入您系统的在线 Excel](https://www.grapecity.com.cn/developer/spreadjs)
- [技术支持](https://gcdn.grapecity.com.cn/showforum-195-1.html)
- [了解低代码知识](https://www.grapecity.com.cn/lowcode/low-code-introduction/overview)