简介
@umijs/ui 是 UmiJS 团队开源的 React UI 组件库，包含了一系列实用的组件，例如按钮、表格、表单、选项卡等。
从 2.0 版本后，@umijs/ui 完全采用 Hooks 实现，能够更好地与函数组件配合使用，而且组件的样式设计也非常优秀。
在使用了该组件库后，你可以省去写样式、处理表格排序和筛选、场景切换等常用组件的开发时间，从而更加高效地开发。
安装
首先，你需要在项目中安装 @umijs/ui，你可以使用 npm 或 Yarn 来完成：
- --- ------- --------- - -- - ---- --- ---------
使用
安装成功后，你只需要在自己的代码中 import 这些组件来使用。举个例子，我们需要显示一个表格：
------ - ----- - ---- ------------
-------- --------- -
----- ---------- - -
- ----- ------- ---- -- --
- ----- ------- ---- -- --
- ----- ------- ---- -- --
--
------ -
------ ------------------------
------------- ------------ --------------------------------
------------- ----------- -------------------------------
--------
--
-这是一个非常简单的表格，包含了两列，一列是姓名，一列是年龄。数据源是一个数组，里面有三个对象。
我们可以看到，使用 @umijs/ui 的组件非常简单，只需要按照文档描述的 props 即可完成页面的搭建。
示例
下面是一些 @umijs/ui 组件的示例代码，供大家参考：
Button
------ - ------ - ---- ------------ -------- ---------- - ------ ------- ------------------------------- -
Input
------ - ----- - ---- ------------ -------- --------- - ------ ------ ------------------- ----- ---------- --- -
Select
------ - ------ - ---- ------------
-------- ---------- -
----- ------- - -
- ------ ------ ------ ----- --
- ------ -------- ------ ------- --
- ------ ------- ------ ------ --
--
------ ------- ----------------- ---
-DatePicker
------ - ---------- - ---- ------------ -------- -------------- - ------ ----------- --- -
Table
------ - ----- - ---- ------------
-------- --------- -
----- ---------- - -
- ----- ------- ---- -- --
- ----- ------- ---- -- --
- ----- ------- ---- -- --
--
------ -
------ ------------------------
------------- ------------ --------------------------------
------------- ----------- -------------------------------
--------
--
-总结
@umijs/ui 是一个非常优秀的 React UI 组件库，其采用 Hooks 技术实现，因此使用起来非常方便。
安装和使用也是非常简单的，只需要按照文档描述来传递 props 即可完成页面的渲染。
以上只是部分示例，实际上该组件库还包含了很多其它的组件，我们可以在文档中查看。有了这个库的帮助，我们可以更加高效地完成页面的开发。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/151759