PrimeReact

最完整的 React UI 组件库。(The Most Complete React UI Component Library)

Github星跟蹤圖

PrimeReact

PrimeReact 是一套丰富的 React 开源 UI 组件。查看 PrimeReact 主页,了解实时展示和文档。

下载

PrimeReact 可以在 npm 上获得,如果你有一个现有的应用程序,运行以下命令将其下载到你的项目中。

npm install primereact --save
npm install primeicons --save

Import

//import {ComponentName} from 'primereact/{componentname}';
import {Dialog} from 'primereact/dialog';
import {Accordion,AccordionTab} from 'primereact/accordion';

依赖关系

大多数 PrimeReact 组件(95%)都是原生的,但也有一些例外,如 Google Maps 的 GMap,需要依赖第三方。

此外,组件的图标需要 PrimeIcons,动画需要 react-transition-group。

dependencies: {
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-transition-group": "^4.4.1",
    "primeicons": "^4.0.0"
}

风格

css 依赖关系如下,注意你可以用你选择的其他主题来改变:

primereact/resources/themes/saga-blue/theme.css
primereact/resources/primereact.min.css
primeicons/primeicons.css

如果你使用的是一个捆绑程序,比如 webpack,它有一个 css 加载器,你也可以把它们导入到你的主应用程序组件中,比如 create-react-app 中的一个例子就是:

import 'primereact/resources/themes/saga-blue/theme.css';
import 'primereact/resources/primereact.min.css';
import 'primeicons/primeicons.css';

快速启动

基于 creation-react-app 的 应用实例 可以在 github 上找到。

TypeScript

Typescript 是完全支持的,因为在 PrimeReact 的 npm 包中提供了类型定义文件。在 github 上也提供了一个 typescript-primereact 应用程序 的示例。


概覽

名稱與所有者primefaces/primereact
主編程語言CSS
編程語言JavaScript (語言數: 3)
平台Linux, Mac, Windows
許可證MIT License
發布數158
最新版本名稱10.6.4 (發布於 )
第一版名稱1.0.0-alpha.1 (發布於 )
創建於2016-12-16 15:56:27
推送於2024-05-04 14:09:21
最后一次提交2024-05-04 08:24:48
星數5.8k
關注者數74
派生數0.9k
提交數10.5k
已啟用問題?
問題數4526
打開的問題數225
拉請求數1718
打開的拉請求數10
關閉的拉請求數309
已啟用Wiki?
已存檔?
是復刻?
已鎖定?
是鏡像?
是私有?

License: MIT
npm version
Join the chat at https://gitter.im/primefaces/primereact

PrimeReact

PrimeReact is a rich set of open source UI Components for React.

PrimeReact Logo

See PrimeReact homepage for live showcase and documentation.

Components demo

Download

PrimeReact is available at npm, if you have an existing application run the following command to download it to your project.

npm install primereact --save
npm install primeicons --save

Import

//import {ComponentName} from 'primereact/{componentname}';
import {Dialog} from 'primereact/dialog';
import {Accordion,AccordionTab} from 'primereact/accordion';

Dependencies

Majority of PrimeReact components (95%) are native and there are some exceptions having 3rd party dependencies such as Google Maps for GMap.

In addition, components require PrimeIcons for icons, classNames package to manage style classes and react-transition-group for animations.

dependencies: {
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-transition-group": "^2.2.1",
    "classnames": "^2.2.5",
    "primeicons": "^2.0.0"
}

Styles

The css dependencies are as follows, note that you may change the theme with another one of your choice.

primereact/resources/themes/nova-light/theme.css
primereact/resources/primereact.min.css
primeicons/primeicons.css

If you are using a bundler such as webpack with a css loader you may also import them to your main application component, an example from create-react-app would be.

import 'primereact/resources/themes/nova-light/theme.css';
import 'primereact/resources/primereact.min.css';
import 'primeicons/primeicons.css';

QuickStart

An example application based on create-react-app is available at github.

TypeScript

Typescript
Typescript is fully supported as type definition files are provided in the npm package of PrimeReact. A sample typescript-primereact application is available as well at github.

去到頂部