115 lines
4.9 KiB
Markdown
115 lines
4.9 KiB
Markdown
|
---
|
|||
|
|
name: jjb-base-component-library
|
|||
|
|
description: 定义 JJB 项目基础组件库与通用工具库的组成与使用规范。在选用业务组件、调用工具函数、查阅 API 或遵循组件使用规范时使用。涵盖 jjb-react-admin-component、jjb-common-lib 及 tools/http/qs/crypto/color 等模块。
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
# 技术栈与基础
|
|||
|
|
|
|||
|
|
## 基础组件库
|
|||
|
|
|
|||
|
|
- **业务组件库**：@cqsjjb/jjb-react-admin-component
|
|||
|
|
|
|||
|
|
- 提供企业级后台管理系统所需的业务组件，包括页面布局、表单、表格、上传等组件
|
|||
|
|
|
|||
|
|
- 主要组件：`PageLayout`、`SearchForm`、`TableAction`、`Editor`、`ImageUploader`、`FileUploader`、`ImageCropper`、`AMap` 等
|
|||
|
|
|
|||
|
|
- 使用规范：必须严格参考对应 MD 文档或 d.ts 文件，不得猜测组件属性
|
|||
|
|
|
|||
|
|
- **通用工具库**：@cqsjjb/jjb-common-lib
|
|||
|
|
|
|||
|
|
- 提供基础工具函数、HTTP 请求、加解密、颜色值等通用功能模块
|
|||
|
|
|
|||
|
|
### @cqsjjb/jjb-common-lib 主要模块
|
|||
|
|
|
|||
|
|
`@cqsjjb/jjb-common-lib` 包含以下主要模块：
|
|||
|
|
|
|||
|
|
- **tools 模块**：包含大量基础工具函数，开发时应优先使用工具库中的工具，避免重复造轮子
|
|||
|
|
|
|||
|
|
- 使用建议：在实现功能前，应先查找 `tools` 模块中是否有对应的工具函数
|
|||
|
|
|
|||
|
|
- 导入方式：`import { tools } from '@cqsjjb/jjb-common-lib';`
|
|||
|
|
|
|||
|
|
- 主要功能分类：
|
|||
|
|
|
|||
|
|
- **JSON/数据解析与序列化**：`parseJSON`、`parseObject`、`parseArray`、`stringifyObject`、`stringifyArray`
|
|||
|
|
|
|||
|
|
- **数据清洗**：`cleanArray`、`cleanObject`
|
|||
|
|
|
|||
|
|
- **类型判断**：`isEmptyObject`、`isEmptyStringObject`、`isEmptyStringArray`、`isNativeEvent`、`getPrimaryType`、`isTrueEnum`、`isFalseEnum`、`isBoolEnum`
|
|||
|
|
|
|||
|
|
- **类型转换**：`toObject`、`toFunction`、`toArray`、`toBoolEnum`
|
|||
|
|
|
|||
|
|
- **数组处理**：`uniqueArray`、`cleanArray`
|
|||
|
|
|
|||
|
|
- **字符串处理**：`classNames`、`toCamelCase`、`toPascalCase`
|
|||
|
|
|
|||
|
|
- **环境检测**：`inIframe`、`inWxBrowser`
|
|||
|
|
|
|||
|
|
- **异步处理**：`asyncWait`
|
|||
|
|
|
|||
|
|
- **路由参数管理**：`router` 对象（包含 `values()`、`keys()`、`query`、`has()`、`add()`、`delete()`、`toString()` 等方法）
|
|||
|
|
|
|||
|
|
- **文件处理**：`base64ToFile`、`fileToBase64`
|
|||
|
|
|
|||
|
|
- **枚举处理**：`getEnumLabel`、`getEnumValue`
|
|||
|
|
|
|||
|
|
- 详细文档：
|
|||
|
|
|
|||
|
|
- 完整使用规范：参考 [`21-jjb-common-lib/01-tools模块使用规范`](../../21-jjb-common-lib/01-tools模块使用规范.md)
|
|||
|
|
|
|||
|
|
- API 参考文档：参考 `reference/tools.md` 查看完整的 API 文档和使用示例
|
|||
|
|
|
|||
|
|
- **http 模块**：基于 axios 高度封装的请求库，专为微应用场景设计
|
|||
|
|
|
|||
|
|
- 核心作用：`declareRequest` 的接口请求就是基于此模块实现
|
|||
|
|
|
|||
|
|
- 导入方式：`import { http } from '@cqsjjb/jjb-common-lib';`
|
|||
|
|
|
|||
|
|
- 主要方法：`Get`、`Post`、`Delete`、`Put`、`Patch`、`request`
|
|||
|
|
|
|||
|
|
- 核心特性：自动 URL 处理、Token 自动注入、租户代码自动注入、401 自动处理、响应数据统一处理、请求/响应拦截器、错误提示
|
|||
|
|
|
|||
|
|
- 详细文档：
|
|||
|
|
|
|||
|
|
- 完整使用规范：参考 [`21-jjb-common-lib/02-http模块使用规范`](../../21-jjb-common-lib/02-http模块使用规范.md)
|
|||
|
|
|
|||
|
|
- API 参考文档：参考 `reference/http.js` 查看完整的实现代码和 API 文档
|
|||
|
|
|
|||
|
|
- **qs 模块**：一个简化的 querystring 模块，用于处理 URL 查询字符串
|
|||
|
|
|
|||
|
|
- 核心作用：`tools.router` 的核心技术基于此 `qs` 模块实现
|
|||
|
|
|
|||
|
|
- 导入方式：`import { qs } from '@cqsjjb/jjb-common-lib';`
|
|||
|
|
|
|||
|
|
- 主要方法：`parse(url)` - 解析 URL 获取 query 参数对象，`stringify(query, prefix?)` - 将对象序列化为 query string
|
|||
|
|
|
|||
|
|
- 详细文档：
|
|||
|
|
|
|||
|
|
- 完整使用规范：参考 [`21-jjb-common-lib/03-qs模块使用规范`](../../21-jjb-common-lib/03-qs模块使用规范.md)
|
|||
|
|
|
|||
|
|
- API 参考文档：参考 `reference/qs.d.ts` 查看完整的类型定义和 API 文档
|
|||
|
|
|
|||
|
|
- **crypto 模块**：基于 cryptojs 实现的简化加解密模块
|
|||
|
|
|
|||
|
|
- 导入方式：`import { crypto } from '@cqsjjb/jjb-common-lib';`
|
|||
|
|
|
|||
|
|
- 主要方法：`AES_128_Encrypt` - AES-128 位加密，`AES_128_Decrypt` - AES-128 位解密，`MD5` - MD5 哈希加密
|
|||
|
|
|
|||
|
|
- 详细文档：
|
|||
|
|
|
|||
|
|
- 完整使用规范：参考 [`21-jjb-common-lib/04-crypto模块使用规范`](../../21-jjb-common-lib/04-crypto模块使用规范.md)
|
|||
|
|
|
|||
|
|
- API 参考文档：参考 `reference/crypto.d.ts` 查看完整的类型定义和 API 文档
|
|||
|
|
|
|||
|
|
- **color 模块**：包含大量预定义的颜色值，提供统一的颜色管理
|
|||
|
|
|
|||
|
|
- 导入方式：`import { color } from '@cqsjjb/jjb-common-lib';`
|
|||
|
|
|
|||
|
|
- 主要颜色分类：基础颜色（BLUE、RED、GREEN 等）、灰色系（GRAY_333 到 GRAY_EEE）、浅灰色系（GRAY_F0 到 GRAY_FE）、特殊颜色（GRAYSKYBLUE、RED_10 等）
|
|||
|
|
|
|||
|
|
- 详细文档：
|
|||
|
|
|
|||
|
|
- 完整使用规范：参考 [`21-jjb-common-lib/05-color模块使用规范`](../../21-jjb-common-lib/05-color模块使用规范.md)
|
|||
|
|
|
|||
|
|
- API 参考文档：参考 `reference/color.js` 查看完整的颜色值列表
|