react有什么插件

這篇文章主要介紹了react有什么插件的相關(guān)知識(shí)，內(nèi)容詳細(xì)易懂，操作簡(jiǎn)單快捷，具有一定借鑒價(jià)值，相信大家閱讀完這篇react有什么插件文章都會(huì)有所收獲，下面我們一起來(lái)看看吧。

react插件有：1、Redux，提供可預(yù)測(cè)化的狀態(tài)管理；2、MobX，通過(guò)函數(shù)響應(yīng)式編程使得狀態(tài)管理變得簡(jiǎn)單和可擴(kuò)展；3、Redux Thunk，Redux的異步處理中間件；4、Dva，一個(gè)基于redux和redux-saga的數(shù)據(jù)流方案；5、Ant design，React UI組件庫(kù)；6、react-icons，基于React的豐富的圖標(biāo)庫(kù)；7、Viser，一個(gè)可視化庫(kù)。

本教程操作環(huán)境：Windows7系統(tǒng)、react18版、Dell G3電腦。

為了提高大家開(kāi)發(fā) React 項(xiàng)目的效率，下面匯總了一些React項(xiàng)目常用插件。

1、狀態(tài)管理

• Redux：JavaScript 狀態(tài)容器，提供可預(yù)測(cè)化的狀態(tài)管理

• MobX：通過(guò)函數(shù)響應(yīng)式編程使得狀態(tài)管理變得簡(jiǎn)單和可擴(kuò)展

• Redux Thunk：Redux的異步處理中間件

• Redux Saga：Redux中間件,用于管理應(yīng)用程序 Side Effect(副作用，例如異步獲取數(shù)據(jù)，訪問(wèn)瀏覽器緩存等)

• Dva：一個(gè)基于redux和redux-saga的數(shù)據(jù)流方案

2、UI組件庫(kù)

• Ant design：基于 Ant Design 設(shè)計(jì)體系的 React UI 組件庫(kù)，主要用于研發(fā)企業(yè)級(jí)中后臺(tái)產(chǎn)品

• Ant design mobile：基于 Ant Design 設(shè)計(jì)體系的 React UI 移動(dòng)端組件庫(kù)

• MaterialUI：世界最受歡迎的基于質(zhì)感設(shè)計(jì)的React UI庫(kù)

• React toolbox：一套使用CSS模塊功能實(shí)現(xiàn)Google的Material Design規(guī)范的React組件

• React Virtualized：一個(gè)能渲染大型列表和表格的React解決方案

• Fabric UI：微軟開(kāi)源的UX框架的集合，用于創(chuàng)建共享代碼，設(shè)計(jì)和交互行為的精美的跨平臺(tái)應(yīng)用程序

• React desktop：基于React的JavaScript庫(kù)，旨在將本機(jī)桌面體驗(yàn)帶入網(wǎng)絡(luò)，其中包含許多macOS Sierra和Windows 10組件。react-desktop與NW.js和Electron.js完美結(jié)合，但是可以在任何JavaScript驅(qū)動(dòng)的項(xiàng)目中使用

• Zent：有贊 PC 端 WebUI 規(guī)范的 React 實(shí)現(xiàn)，提供了一整套基礎(chǔ)的 UI 組件以及一些常用的業(yè)務(wù)組件

• react-icons：基于React封裝的豐富的圖標(biāo)庫(kù)

3、工具類

• react-copy-to-clipboard：基于React的復(fù)制到剪切板組件

• qrcode.react：基于React的生成二維碼的組件

• nprogress：適用于YouTube，Medium等的頂部進(jìn)度條組件

• react-syntax-highlighter：基于React的代碼高亮組件

• react-contextmenu：右鍵菜單組件

• emoji-mart：基于React的表情庫(kù)

• react-highlight-words：基于React的關(guān)鍵字高亮

4、數(shù)據(jù)可視化

• AntV：包含 G2、G6、F2、L7 以及一套完整的圖表使用和設(shè)計(jì)規(guī)范, 提供強(qiáng)大的數(shù)據(jù)可視化需求

• G2Plot：基于G2封裝的開(kāi)箱即用的可視化組件庫(kù)

• recharts：使用React和D3構(gòu)建的自定義的圖表庫(kù)

• Viser：支持多種主流框架的可視化庫(kù)

5、動(dòng)畫/動(dòng)效果

• Halogen：使用React的加載動(dòng)畫集合

• react-move：漂亮的，數(shù)據(jù)驅(qū)動(dòng)的React動(dòng)畫,只需3.5kb（gzip）

• react-spring：一個(gè)基于彈簧物理學(xué)的動(dòng)畫庫(kù)

• Ant Motion：提供了單項(xiàng)，組合動(dòng)畫，以及整套動(dòng)畫解決方案

• scenejs：基于JavaScript和CSS時(shí)間軸的動(dòng)畫庫(kù)

• react-text-loop：文字輪播動(dòng)畫

6、拖拽/排序

• react-beautiful-dnd：漂亮,可移植性 列表拖拽庫(kù)

• react-dnd：可幫助我們構(gòu)建復(fù)雜的拖放界面，同時(shí)保持組件的分離

• react-moveable：支持自由拖拽, 縮放, 參考線的靈活強(qiáng)大的拖拽庫(kù)

• react-grid-layout：強(qiáng)大的網(wǎng)格拖拽排序縮放庫(kù)

• mixitup：強(qiáng)大的列表卡片排序動(dòng)畫庫(kù)

7、圖像處理

• react-image-crop：強(qiáng)大的圖片裁切庫(kù)

• react-sparklines：基于數(shù)據(jù)自動(dòng)生成趨勢(shì)線

• dom-to-image：基于dom生成圖片的canvas庫(kù)

• react-img-editor：圖片編輯器

8、編輯器相關(guān)

• braft-editor：富文本編輯器

• powerNice：markdown/富文本編輯器

• GGEditor：可視化圖編輯器

• react-codemirror2：代碼編輯器

• jsoneditor：json編輯器

• h6-dooring：H5頁(yè)面編輯器

9、地圖相關(guān)

• google-map-react：谷歌地圖插件

• react-amap：高德地圖插件

• @uiw/react-baidu-map：百度地圖

10、腳手架

• Create React App：初學(xué)者必備React傻瓜式腳手架

• Next.js：構(gòu)建服務(wù)端渲染的React腳手架

• umi：企業(yè)級(jí)前端應(yīng)用框架

• webpack3_react：兼容IE9+且提供完整的React全家桶解決方案

關(guān)于“react有什么插件”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對(duì)“react有什么插件”知識(shí)都有一定的了解，大家如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道。