ant-design/docs/react/recommendation.zh-CN.md

48 lines
3.0 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
order: 7
title: 社区精选组件
---
`antd` 是 Ant Design 设计规范的 React 实现,所以我们倾向于只提供符合该规范、且带有视觉展现的 UI 组件,也尽量不重复造轮子。我们推荐使用以下社区已有的优秀实现,与 antd 形成互补:
类型 | 推荐组件
----|--------
路由 | [react-router](https://github.com/ReactTraining/react-router)
布局 | [react-blocks](https://github.com/whoisandy/react-blocks) [react-flexbox-grid](https://github.com/roylee0704/react-flexbox-grid)
拖拽 | [react-dnd](https://github.com/gaearon/react-dnd) [react-draggable](https://github.com/mzabriskie/react-draggable)
代码编辑器 | [react-codemirror2](https://github.com/scniro/react-codemirror2)
富文本编辑器 | [react-quill](https://github.com/zenoamaro/react-quill) [react-draft-wysiwyg](https://github.com/jpuri/react-draft-wysiwyg) [react-lz-editorAnt Design 风格)](https://github.com/leejaen/react-lz-editor) [braft-editor](https://github.com/margox/braft-editor)
拾色器 | [rc-color-picker](https://github.com/react-component/color-picker) [react-color](http://casesandberg.github.io/react-color/)
响应式 | [react-responsive](https://github.com/contra/react-responsive) [react-media](https://github.com/ReactTraining/react-media)
复制到剪贴板 | [react-copy-to-clipboard](https://github.com/nkbt/react-copy-to-clipboard)
页面 meta 属性 | [react-helmet](https://github.com/nfl/react-helmet) [react-document-title](https://github.com/gaearon/react-document-title)
图标 | [react-fa](https://github.com/andreypopp/react-fa) [react-icons](https://github.com/gorangajic/react-icons)
二维码 | [qrcode.react](https://github.com/zpao/qrcode.react)
可视化图表 | [BizCharts](https://github.com/alibaba/BizCharts) [recharts](https://github.com/recharts/recharts/) [victory](https://github.com/FormidableLabs/victory)
顶部进度条 | [nprogress](https://github.com/rstacruz/nprogress)
应用国际化 | [react-intl](https://github.com/yahoo/react-intl)
代码高亮 | [react-syntax-highlighter](https://github.com/conorhastings/react-syntax-highlighter)
Markdown 渲染 | [react-markdown](http://rexxars.github.io/react-markdown/)
无限滚动 | [react-virtualized](https://github.com/bvaughn/react-virtualized)
地图 | [react-google-maps](https://github.com/tomchentw/react-google-maps) [google-map-react](https://github.com/istarkov/google-map-react) [react-amap 高德](https://github.com/ElemeFE/react-amap)
右键菜单 | [react-contextmenu](https://github.com/vkbansal/react-contextmenu/) [react-contexify](https://github.com/fkhadra/react-contexify)
Emoji | [emoji-mart](https://github.com/missive/emoji-mart)
<style>
.markdown table td:first-child {
font-weight: 500;
width: 20%;
background: #fcfcfc;
}
.markdown table td > a:not(:last-child) {
margin-right: 18px;
}
.markdown table td > a:not(:last-child):after {
content: '|';
color: #bbb;
margin: 0 6px 0 8px;
pointer-events: none;
position: absolute;
}
</style>