@qin-ui/pro-components-core
Pro Components 的核心逻辑层，不绑定任何具体 UI 组件库。
简介
@qin-ui/pro-components-core 是 @qin-ui 系列组件库的公共逻辑底座，提供了 ProForm / ProTable 背后的状态管理与数据流实现，包括：
- 表单数据管理（响应式数据、深层路径读写、批量更新）
- 字段配置管理（增删改查、嵌套字段、查找函数）
- 底层 Form 组件实例引用
- 表格实例管理（列、数据源、分页、搜索表单集成）
- 通用工具函数（
getObject、camelizeProperties等）
它本身不渲染任何 UI，而是与具体 UI 组件库配合使用：
| UI 库 | 对应组件包 |
|---|---|
| antdv-next | @qin-ui/antdv-next-pro |
| Ant Design Vue | @qin-ui/antd-vue-pro |
| Element Plus | @qin-ui/element-plus-pro |
| Vant | @qin-ui/vant-pro |
通常你不需要直接安装本包，安装上述任一组件包时会自动作为依赖引入。仅在需要复用其纯逻辑能力（脱离 UI 框架使用表单/字段管理）时才直接依赖。
核心 API
| API | 类型 | 说明 |
|---|---|---|
useForm | Hook | 创建表单实例，组合数据、字段、ref 三层能力 |
useTable | Hook | 创建表格实例，管理列、数据源、分页、搜索表单 |
useFields | Hook | 字段配置增删改查（支持嵌套） |
useFormData | Hook | 表单数据管理（响应式 + 深层路径） |
useFormRef | Hook | 底层 Form 组件实例引用管理 |
Form | 类型 | 表单实例类型 |
Table | 类型 | 表格实例类型 |
使用示例
import { useForm, useTable } from '@qin-ui/pro-components-core';
interface User {
name: string;
age: number;
}
// 创建表单实例（纯逻辑，可配合任意 UI 库使用）
const form = useForm<User>({ name: '张三', age: 25 }, [
{ path: 'name', label: '姓名' },
]);
form.formData.name; // '张三'（响应式）
form.setFormData('name', '李四');
form.getField('name'); // 获取字段配置
设计特点
- 逻辑与 UI 解耦：核心 Hook 不依赖任何 UI 框架，由各组件包绑定具体 UI 库的类型（如 antdv-next 的
FormInstance） - 类型安全：完整的 TypeScript 类型推导，支持深层路径（
getFormData('address.city')） - 源码可跳转：发布产物带 declaration map，IDE 中 Go to Definition 可直达源码
技术栈
- Vue 3.3+（依赖
reactive/ref/provide/inject）