在React的开源组件库中, 有许多的组件库供开发者选择, 比较出名的有MUI, Mantine, antd等, 从组件的功能上都比较类似, 即便某个库不具备某个组件, 自己手写一个也不难. 难的是选择一个组件库, 就是选择了它的一个样式方案. 而且这些库都比较重, 引入了太多的概念, 有些库因为样式框架的原因不仅导致了运行时性能影响, 还导致不能适配React v18新的服务端渲染的功能. 其中比较钦佩的是Mantine, 它在v7版本中彻底放弃了css-in-js, 改为css modules 并重写了所有组件, 决心之大响应之快都令我打心底佩服. 因此它也是主要的借鉴对象.
我所希望的组件库应该是这样的:
基于上述原因, 开发并开源了rtdui组件库
如果你的要求和我一样, 那么rtdui就非常适合你.
rtdui 使用Tailwindcss作为样式框架, 预置了大量的主题. rtdui的开发理念是使用现代的H5功能, 用最少的结构和代码实现组件的功能. 它吸收和借鉴了其它组件库的优点和精髓, 可以说它是站在巨人的肩膀上的. 但没有像其它库一样陷在CSS-in-JS的泥潭中.
rtdui 由多个独立的包组成, 你可以根据自己的需要选择安装:
包 | 说明 |
@rtdui/tailwind-plugin | 为Tailwindcss提供的rtdui插件, 方便与Tailwind集成 |
@rtdui/hooks | 提供了一组有用的React Hooks, 下面的包都依赖于它 |
@rtdui/core | 核心组件库, 包含了大量基础组件. 下面的包都依赖于它 |
@rtdui/code-highlight | 兼容prism.js的代码高亮的组件 |
@rtdui/datatable | 全功能的数据表格组件, 以及数据表格下拉选择组件 |
@rtdui/dialogs | 对话框系统, 可以使用命令方式打开对话框. |
@rtdui/notifications | 通知系统, 可以使用命令方式展示通知. |
@rtdui/editor | 全功能的富文本编辑器组件 |