15.9K ·GitHub
这是干什么的?
它是一个 React 组件,能根据 JSON Schema 生成完整的网页表单:你用声明式的方式描述自己的字段,它就会帮你渲染表单并做校验。
它是在线托管的表单搭建服务,还是我要装到自己 React 应用里的库?
它是一个库:你安装 @rjsf 的 npm 包,然后在自己的 React 应用里渲染它的 Form 组件。唯一托管在网上的部分是一个供试用的浏览器 playground。
我怎么把它装到自己的项目里?
从 npm 安装 @rjsf/core,同时装一个匹配你 UI 组件库的主题包和一个校验器,然后用你的 JSON Schema 渲染 Form 组件。完整文档由 Docusaurus 驱动。
除了 React,我还需要引入什么?
需要一个与你组件库匹配的主题包,外加一个 JSON Schema 校验器:@rjsf/validator-ajv8、@rjsf/validator-ata 或 @rjsf/validator-cfworker。
'根据 JSON Schema 生成表单'具体是什么意思——难道每个字段我不用手写了吗?
你提供一份描述数据和规则的 JSON Schema,组件会根据它自动生成对应的表单字段——这正是声明式的意义所在。
安装之前能先试用吗?
可以——playground 直接托管在 GitHub Pages 上,你可以在浏览器里随手写一个 schema,立刻看到生成的表单。
表单可以用哪些组件库做主题?
官方以包的形式提供了十套主题:Ant Design v5、Bootstrap 3 和 5(通过 React-Bootstrap)、Chakra UI v3、Daisy UI v5、Fluent UI v9、Mantine、Material UI v7、Semantic UI v2 和 Shad CN。
它成熟到可以在生产环境放心使用吗?
它从 2015 年开发至今,在 GitHub 上约有 16,000 颗星,采用 Apache-2.0 许可证,代码放在一个带 CI、测试和 TypeScript 类型检查的 monorepo 中发布。
What are similar projects?
formily, redux-form, react-bootstrap, selectize.js, formik, ajv, primitives, evergreen
Which topics is it in?
declarative-ui, data-validation, antd, form, json-schema, forms, schema, bootstrap, validation, component-library, json, ui-components

