Button 按钮
常用的操作按钮。
基础用法
使用type、plain、round和circle属性来定义 Button 的样式。
禁用状态
你可以使用 disabled 属性来定义按钮是否被禁用。
使用 disabled 属性来控制按钮是否为禁用状态。 该属性接受一个 Boolean 类型的值。
链接按钮
文字按钮
没有边框和背景色的按钮。
图标按钮
使用图标为按钮添加更多的含义。 你也可以单独使用图标不添加文字来节省显示区域占用。
按钮组
以按钮组的方式出现,常用于多项类似操作。使用<swc-button-group>标签来嵌套你的按钮。
加载中
点击按钮来加载数据,并向用户反馈加载状态。
通过设置 loading 属性为 true 来显示加载中状态。
调整尺寸
除了默认的大小,按钮组件还提供了几种额外的尺寸可供选择,以便适配不同的场景。
使用 size 属性额外配置尺寸,可使用 large 和 small 两种值
Button 属性
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| size | 尺寸 | string | large / default / small | default |
| type | 类型 | string | primary / success / warning / danger / info | — |
| text | 是否文字按钮 | boolean | — | false |
| plain | 是否朴素按钮 | boolean | — | false |
| round | 是否圆角按钮 | boolean | — | false |
| circle | 是否圆形按钮 | boolean | — | false |
| loading | 是否加载中状态 | boolean | — | false |
| disabled | 是否禁用状态 | boolean | — | false |
| icon | 图标类名 | string | — | — |
Button 插槽
| 插槽名 | 说明 | 子标签 |
|---|---|---|
| default | 自定义默认内容 | Button |
| loading | 自定义加载中组件 | - |
| icon | 自定义图标组件 | - |