React UI 库
- 通用 UI 组件, 帮助快速构建 React 项目
- Modern browsers and Internet Explorer 11+
 IE / Edge |
 Firefox |
 Chrome |
 Safari |
 Electron |
|---|---|---|---|---|
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
npm i didi-ui
or
cnpm i didi-ui
or
yarn add didi-ui
import { LayoutContainerTB6px, Divider } from 'didi-ui';
const App = () => (
<div>
<LayoutContainerTB6px>
hello
<Divider />
world
</LayoutContainerTB6px>
</div>
);| 组件名称 | 描述 |
|---|---|
| ---------布局容器组件---------------- | |
| MainContainerTB6px | 主容器布局, 上 8px 下 8px |
| LayoutContainerTB | 布局容器, 上 0px 下 0px |
| LayoutContainerTB6px | 布局容器, 上 6px 下 6px |
| LayoutContainerTB8px | 布局容器, 上 8px 下 8px |
| LayoutContainerT6px | 布局容器, 上 6px 下 0px |
| LayoutContainerB6px | 布局容器, 上 0px 下 6px |
| Divider | 分割线 |
| ------------------ | |
| Display | 通用标题组件 |
| SidebarSwitch | 侧边栏切换组件 |
| Breadcrumb | 面包屑组件 |
| StickyBlockBox | 锚点导航栏组件 |
| ChangeIconMenu | 点击更换图标组件 |
| ShowEmoji | emoji 渲染组件 |
| SearchEmoji | emoji 查找组件 |
| Draggable | 拖拽组组件 |
| --------菜单---------- | |
| Menu | 菜单组件 |
| MainMenu | 主菜单 |
| SubMenu | 子菜单 |
| --菜单 base-component 基础组件-------- | |
| SmallIconView | 小图标组件 |
| MediumIconView | 中图标组件 |
| BigIconView | 大图标组件 |
| EmojiIconView | emoji 图标组件 |
| DragView | 拖拽组件 |
| ColorView | 颜色组件 |
| ----菜单 other-component 其他组件------ | |
| FilterInputView | 过滤组件 |
| GroupTitleView | 分组标题组件 |
| HintText | 提示文本 |
| HintButton | 提示按钮 |
| ----菜单 complex-component 复杂组件----- | |
| DragGroupView | 拖拽组合组件 |
| SelectGroupView | 单选组合组件 |
| ------菜单 user-component 用户组价------ | |
| UserInfoView | 显示用户信息的组件 |
| UserWorkView | 显示用户工作区域的组件 |
| UserAddButton | 一个带添加按钮的组件 |
| ---菜单 sub_component 子组件------- | |
| Text | 纯文本组件 |
| Arrow | 箭头组件 |
| ShortcutsKey | 快捷键 ⌘+C |
| SwitchButton | 开关 |
| SelectButton | 选择框 |
| MoreButton | 更多按钮 |
| SelectedIcon | 选中图标 ✔️ |