用途:@json-render/react 是 json-render 的 React 渲染器,把 JSON 规格(spec)转换为 React 组件树,用于以 JSON 驱动的方式构建 React 界面。
主要能力:通过 defineCatalog 定义组件目录(含 props 的 zod schema 与描述),再用 defineRegistry 注册类型安全的组件实现,最后用 Renderer 渲染 spec。spec 采用元素树格式,含 root、type、props、children。支持可见性条件(visible,含 $state、eq、not、$and、$or 及 visibility 辅助函数)、动态 prop 表达式($state、$bindState、$bindItem、$cond、$template、$computed)、事件系统(emit 与 on,元素 on 字段映射事件到 action)、状态监听 watch,以及内置 action:setState、pushState、removeState、validateForm。提供 StateProvider、ActionProvider、VisibilityProvider、ValidationProvider 等 Provider,并支持外部 store(createStateStore / StateStore)实现受控模式。
使用方式:安装后从 @json-render/react 导入 defineRegistry、Renderer,从 @json-render/core 导入 defineCatalog,从 @json-render/react/schema 导入 schema。表单双向绑定在自然 value prop 上使用 { "$bindState": "/path" },组件内用 useBoundProp 读写;$computed 函数通过 JSONUIProvider 或 createRenderer 的 functions prop 注册。
适用场景:需要由 JSON 规格动态生成 React UI、构建可复用组件库(如 BaseComponentProps)或从 API 流式获取 spec(useUIStream)的场景。
限制:资料未提供具体安装命令、版本要求、收费与平台信息;双向绑定不使用 statePath prop,action 参数中的 statePath 仅用于变更路径。