SuperAPI AI 工具集

json-render-react

前端与建站

查看项目

更新于 10-15 17:23

技能介绍

用途:@json-render/react 是 json-render 的 React 渲染器,用于将 JSON 规范转换为 React 组件树,适合用 JSON 描述并生成 React 界面的场景。主要能力:通过 defineRegistry 从 catalog 创建类型安全的组件注册表,再由 Renderer 渲染规范;组件接收已解析的 props。支持可见性条件(visible)与 $and/$or 等组合,以及 visibility.when、unless、eq、and、or 辅助函数。提供 StateProvider、ActionProvider、VisibilityProvider、ValidationProvider 等 Provider,用于状态共享、动作处理、条件渲染和表单校验。支持外部状态管理(Redux、Zustand、XState 等),可通过 createStateStore 创建 StateStore 并传入 StateProvider,此时 initialState 与 onStateChange 被忽略。支持动态属性表达式:$state、$bindState、$bindItem、$cond/$then/$else、$template、$computed。事件系统通过 emit 触发命名事件,on() 获取带元数据的事件句柄(emit、shouldPreventDefault、bound),元素的 on 字段将事件映射到动作绑定。支持 watch 字段在状态变化时触发动作。内置动作 setState、pushState、removeState、validateForm 由 ActionProvider 自动处理。表单双向绑定用 useBoundProp,在 value 属性上使用 {"$bindState": "/path"},组件不通过 statePath 做双向绑定。主要导出包括 defineRegistry、Renderer、schema、useStateStore、useStateValue、useBoundProp、useActions、useAction、useOptionalValidation、useUIStream、createStateStore、StateStore、BaseComponentProps、EventHandle、ComponentContext。限制:资料未提供安装命令、版本、价格或平台支持信息。