在前端开发中，我们常常需要使用图标按钮。@beisen/icon-button 是一款由百胜前端团队开发的基于 React 的图标按钮组件，具有方便快捷，易于使用等特点。
本文将介绍如何安装和使用该 npm 包，包括组件的 API、示例代码和注意事项等。
安装
使用 npm 包管理器，通过下面的命令安装 @beisen/icon-button。
npm install @beisen/icon-button --save
如果你使用的是 yarn 包管理器，则可以通过以下命令安装：
yarn add @beisen/icon-button
基本用法
@beisen/icon-button 组件支持以下属性：
| 属性 | 类型 | 说明 |
|---|---|---|
| icon | string | 图标名称，具体名称见文档 |
| type | string | 按钮类型：primary、danger、dashed、ghost、default |
| disabled | boolean | 是否禁用 |
| className | string | 自定义 class 名称 |
| onClick | function | 点击事件回调函数 |
示例代码：
-- -------------------- ---- -------
------ ----- ---- --------
------ ------ ---- ----------------------
------ ------- ----- ------- ------- --------------- -
----------- - -- -- -
------------------- ----------
-
-------- -
------ -
-----
------- ----------- -------------- -------------------------- --
------- ----------- --
------- ------------- ------------- --
------- ------------ ------------- -------- --
------- ----------- ------------ --
------- -------------- -------------- --
------
-
-
-上述代码中，我们通过 import 引入了 @beisen/icon-button 组件，然后在 render 方法中使用该组件，并向其传递了多个属性值。
注意事项
@beisen/icon-button 组件依赖于
antd和@ant-design/icons库，请确保已安装这两个依赖。在使用 @beisen/icon-button 组件时，请注意其与 antd 自带的 Button 组件之间的差异。
如果您在使用过程中需要调整样式或其他属性，请通过 className 属性或 CSS 文件进行自定义。
总结
通过本文的介绍，你已经了解了 @beisen/icon-button 的安装和基本用法，以及需要注意的事项。希望这些信息能够帮助你更快更准确地使用该组件，并且能够在你的项目中提高效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/beisen-icon-button