用途:Refine 是用于构建企业级 CRUD 应用的 headless React 框架,提供开箱即用的数据获取、路由、鉴权与访问控制能力,同时保持 UI 无关,适合构建管理面板、后台系统等场景。
主要能力:围绕数据提供者(后端适配器,如 REST、GraphQL)、资源(应用中的实体,如 posts、users、products)、Hooks(useList、useOne、useCreate、useUpdate、useDelete、useForm、useTable)、鉴权提供者(登录、登出、权限)与路由提供者(集成 React Router 等)等核心抽象组织应用,框架完全类型化。5.0.12 版本中 useList 与 useTable 会保留 getList 返回的自定义字段,适用于数据提供者在行列表之外返回聚合或分页元数据的场景。
使用方式:可用脚手架命令 npm create refine-app@latest(选择 Vite、Mantine、REST API)快速创建,也可手动安装 @refinedev/core、@refinedev/mantine、@refinedev/react-router 及 Mantine 包。在 Refine 组件中配置 dataProvider、routerProvider 与 resources,并为各资源定义 list、create、edit、show 路由,页面组件配合相应 Hooks 使用。新增功能步骤:定义资源、创建页面组件、配置匹配路由、使用合适 Hooks、按需配置鉴权提供者。
限制与注意:不要混用多个 UI 库,选定 Mantine 后保持一致;不要绕过数据提供者,始终通过 Refine Hooks 操作数据;不要硬编码 API URL,应使用数据提供者配置;不要跳过资源定义,所有 CRUD 实体都需在 resources 中声明;应利用 TypeScript 类型。详细指南覆盖数据提供者、资源、路由、Hooks、鉴权与访问控制(RBAC/ABAC、Casbin/CASL)、Mantine 集成、inferencer、通知、i18n 与实时(LiveProvider)等主题。