魔法
您定义意图 (JSON)。我们渲染现实 (React)。
{
"type": "dataTable",
"schema": "users",
"columns": [
{ "field": "name", "sortable": true },
{ "field": "email", "sortable": true },
{ "field": "role", "filterable": true }
],
"actions": [
{
"label": "Edit",
"type": "navigate",
"route": "/users/:id/edit"
},
{
"label": "Delete",
"type": "confirm",
"variant": "destructive"
}
],
"pagination": true,
"search": true
}为什么选择 ObjectUI？
您喜爱的现代技术栈，通过协议驱动开发实现高效。
您喜爱的技术栈
基于 React、Radix 原语 (Shadcn UI) 和原生 Tailwind CSS 构建。不是黑盒子——用实用类覆盖样式，用您自己的组件扩展。匹配您设计系统的生产级输出。
服务端驱动的敏捷性
从后端更新布局、字段和验证规则，无需重新部署前端代码。即时发布变更。非常适合 A/B 测试、功能标记和动态用户体验。
企业级现成组件
内置复杂模式：看板、甘特图、多步表单、具有排序和过滤功能的数据表。停止为每个项目从头开始重建这些。
完全可扩展
将您自己的 React 组件注册到引擎中，并在 JSON Schema 中使用它们。不受限于内置组件。您的自定义小部件、您的业务逻辑，无缝集成。
如何工作
三层架构：协议 → 引擎 → 渲染器
步骤 1: 协议
JSON Schema 定义视图结构。类型安全、版本化且对 LLM 友好。您的 UI 逻辑是数据，而不是代码。
步骤 2: 引擎
ObjectUI Core 处理状态、处理事件、管理表单验证并编排数据流。您的业务逻辑保持干净。
步骤 3: 渲染器
React 组件将 JSON 节点映射到 Shadcn UI 原语。从您的协议定义渲染出美观、可访问的界面。
用例
从快速原型到生产级企业系统。
管理仪表板与内部工具
从 Schema 生成完整的管理界面。CRUD 操作、高级过滤、批量操作——全部声明性定义。在几小时内而不是几周内交付内部工具。
动态表单与工作流
多步向导、条件逻辑、复杂验证。构建无需编写状态管理代码即可适应用户输入的入职流程、调查和数据收集表单。
数据密集型应用
具有虚拟化、实时更新、导出功能的表格。可流畅处理数百万行的仪表板小部件、分析面板和报告界面。
不仅仅是玩具
针对复杂要求的生产级可扩展性。
注册自定义 React 组件并在 JSON Schema 中使用它们。ObjectUI 不会锁定您——它是您构建的基础。当您需要特定功能时，编写一次 React 组件，并在所有协议驱动的界面中重复使用它。
// 1. Register your custom component
import { SignaturePad } from '@/components/custom';
objectUI.registerComponent('signaturePad', SignaturePad);
// 2. Use it in your JSON schema
{
"type": "form",
"fields": [
{ "name": "name", "type": "text" },
{
"name": "signature",
"type": "signaturePad", // Your custom component
"label": "Please sign here",
"required": true
}
]
}
// 3. It just works
// ✓ Validation integrated
// ✓ State management handled
// ✓ Reusable across all formsObjectStack 的一部分
完整的协议驱动开发平台。
ObjectUI 可与任何 REST API 独立工作，但它旨在与 ObjectQL（通用数据层）和 ObjectOS（运行时平台）完美配合。它们共同构成了一个完整的技术栈，其中业务逻辑被定义为协议，而不是被锁定在特定框架的代码中。
Standalone
与任何后端 API 协同工作
Integrated
与 ObjectQL + ObjectOS 无缝集成，实现端到端协议驱动开发