简介
@nxus/admin-ui 是使用 React 和 Redux 构建的一个用于构建后台管理界面的 npm 包。它包含了许多常见的 UI 组件和功能，比如：表格、搜索、分页、图表等。它可帮助开发者快速构建类似于后台管理系统的应用程序。
安装
你可以通过 npm 安装 @nxus/admin-ui：
npm install --save @nxus/admin-ui
使用
在你的应用程序中导入 @nxus/admin-ui，创建一个 <AdminUI> 组件，并将其渲染到你的页面中：
-- -------------------- ---- -------
------ ----- ---- --------
------ -------- ---- ------------
------ --------- ---- -----------------
----- --- - -- -- -
------ -
-------- --------- ----- -------
----------- -- -- ----- -----------
----------
--
--
-------------------- --- ---------------------------------你可以根据你的需求来配置 <AdminUI> 组件的 title 和 menu 属性。menu 属性是一个数组，包含了所有的菜单项。每一项都应该包含一个 label 属性和一个 path 属性。例如：
<AdminUI title="My Admin Panel" menu={[
{path: '/', label: 'Dashboard'},
{path: '/users', label: 'Users'},
{path: '/settings', label: 'Settings'},
]}>示例
表格
@nxus/admin-ui 提供了一个 <Table> 组件，可以帮助你快速构建一个表格。它支持自动分页、排序和搜索。
-- -------------------- ---- -------
------ ----- ---- --------
------ ------- ---- -----------------
----- ---- - -
---- -- ----- ------ ---- ----
---- -- ----- -------- ---- ----
---- -- ----- ------- ---- ----
--
----- ------- - -
------- ----- ------ ------
------- ------- ------ --------
------- ------ ------ -------
--
----- ------------ - -- -- -
------ -
------ ----------- ----------------- --
--
--图表
@nxus/admin-ui 提供了一个 <Chart> 组件，可以帮助你快速构建一个图表。它支持多种类型的图表，包括：折线图、柱状图、饼状图、散点图等。
-- -------------------- ---- -------
------ ----- ---- --------
------ ------- ---- -----------------
----- ---- - -
--- -- -- ---
--- -- -- ---
--- -- -- ---
--- -- -- ---
--- -- -- ----
--
----- ------------ - -- -- -
------ -
------ ----------- ----------- ---------- ---------- --
--
--结论
@nxus/admin-ui 是一个强大的 npm 包，可以帮助前端开发者快速构建类似于后台管理系统的应用程序。它提供了许多常见的 UI 组件和功能，例如：表格、搜索、分页、图表等。希望这篇文章可以帮助你学习如何使用它。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066bcf967216659e244e66