@contant-core-ui/base 是一个前端 UI 组件库，可以帮助开发者快速构建基础 UI 组件。在本篇文章中，我们将会介绍如何使用 @contant-core-ui/base 包。
安装
要使用 @contant-core-ui/base 包，你需要先安装 npm。如果你还没有安装 npm，请按照 npm 官网的指引 安装。
然后使用以下命令进行安装：
npm install @contant-core-ui/base
使用
引入
在使用 @contant-core-ui/base 包之前，你需要先引入包。你可以在你的项目的入口文件中引入它：
import "@contant-core-ui/base/dist/index.css";
import { Button } from "@contant-core-ui/base";组件
通过以下代码实现一个 Button 组件：
import { Button } from "@contant-core-ui/base";
<Button>Click Me</Button>Button 组件默认添加了类名 “button-primary”，这是一个默认样式。你也可以使用其它属性来自定义样式，属性介绍如下：
| 属性 | 说明 |
|---|---|
| className | 自定义的类名 |
| children | Button 内容，可以是文本或者其它组件 |
| disabled | 禁用状态 |
| type | 按钮类型，默认为 button |
| onClick | 点击事件的回调函数 |
| buttonType | 按钮类型，默认为 "primary" |
| element | 组件元素，默认为 "button" |
| size | 尺寸，默认为 "medium"，支持 "small"/"large" |
| block | 块状按钮 |
| rounded | 圆角按钮 |
| link | 链接按钮 |
| buttonVariant | 按钮主题 |
| buttonDisabled | 按钮禁用状态 |
| buttonSize | 按钮尺寸 |
示例
下面是一个使用 Button 组件的示例：
-- -------------------- ---- -------
------ - ------ - ---- ------------------------
-------- ----- -
----- ----------- - -- -- -
-----------------------
--
------ -
--
------- --------------------------- -----------
---
--
-总结
@contant-core-ui/base 是一个优秀的前端 UI 组件库，可以帮助开发者快速构建基础 UI 组件。在本篇文章中，我们介绍了如何在你的项目中使用 @contant-core-ui/base 包。如果你想进一步了解 @contant-core-ui/base 包的使用，请参考其官方文档。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066b5451ab1864dac669a1