简介
mhd-react 是一个基于 React 开发的 UI 组件库，提供了丰富的组件和样式，适用于前端开发中常见的界面开发需求，目前已发布至 npm 平台，可方便地通过 npm 安装使用。
安装
你可以通过 npm 安装 mhd-react，执行以下命令：
npm install mhd-react --save
使用
在 React 项目中使用 mhd-react，需要在文件中引入需要的组件，示例代码如下：
-- -------------------- ---- -------
------ ----- ---- --------
------ - ------- ----- - ---- ------------
-------- ----- -
----- --------------- - -- -- -
---------------
------ --------
-------- ---------------
------- -----
----------- -----
----- -- -- --------------------
--------- -- -- --------------------
---
--
------ -
-----
------- ----------------------------------------
------
--
-
------ ------- ----组件
mhd-react 提供了以下常见的组件：
Button
按钮组件，提供了基础按钮、主按钮、次按钮、虚线按钮等多种样式。
import { Button } from 'mhd-react';
<Button type="primary">主按钮</Button>
<Button type="default">基础按钮</Button>
<Button type="dashed">虚线按钮</Button>
<Button type="link">链接按钮</Button>Modal
模态框组件，提供了警告框、确认框、信息框等多种样式。
-- -------------------- ---- ------- ------ - ----- - ---- ------------ ------------- ------ ----- -------- --------------- --- --------------- ------ ----- -------- --------------- ----- -- -- -------------------- --------- -- -- -------------------- --- ------------ ------ ----- -------- ------- ---
Input
输入框组件，提供了单行输入框、多行输入框等多种样式。
import { Input } from 'mhd-react';
<Input placeholder="请输入" />
<Input.TextArea placeholder="请输入" />Select
选择框组件，提供了单选框、多选框等多种样式。
-- -------------------- ---- ------- ------ - ------ - ---- ------------ ------- ----------------- -------------- ----------------------------- -------------- ----------------------------- -------------- ----------------------------- --------- ---------------------- ------------------- ------ ---------------- ------------------------------- ---------------- ------------------------------- ---------------- ------------------------------- ------------------------
Table
表格组件，提供了多选表格、可编辑表格等多种功能。
-- -------------------- ---- -------
------ - ----- - ---- ------------
----- ---------- - -
- ---- ---- ----- ------- ---- --- -------- ---- ---- --- - ---- ----- --
- ---- ---- ----- ------ ---- --- -------- ------- --- - ---- ----- --
--
------
-----------------------
----------
- ------ ----- ---------- ------- ---- ------ --
- ------ ----- ---------- ------ ---- ----- --
- ------ ----- ---------- ---------- ---- --------- --
--
---------------
----- -----------
--------- ----------------- ------------- --
---------------------------- --------------
--
-----------
----- -------
------- ----- -- -------------------- -----
--
---总结
mhd-react 提供了丰富的 UI 组件和样式，方便我们在 React 项目中快速构建页面。使用 mhd-react 需要注意组件的 API 和用法，但是掌握后可大大提高前端开发的效率和体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f451d8e776d08040f52