按钮 Button
基础用法
禁用状态
你可以使用 disabled
属性来定义按钮是否被禁用。
图标按钮
使用图标为按钮添加更多的含义。 你也可以单独使用图标不添加文字来节省显示区域占用。
按钮组
以按钮组的方式出现,常用于多项类似操作。
使用 <sh-button-group>
对多个按钮分组。
加载状态按钮
点击按钮来加载数据,并向用户反馈加载状态。
调整尺寸
除了默认的大小,按钮组件还提供了几种额外的尺寸可供选择,以便适配不同的场景。
自定义颜色
您可以自定义按钮的颜色。
我们将自动计算按钮处于 hover
和 active
状态时的颜色。
Button API
Button Attributes
属性名 | 说明 | 类型 | 默认值 |
---|---|---|---|
type | 类型 | enum | default |
size | 尺寸 | enum | default |
color | 颜色 | ||
disabled | 按钮是否为禁用状态 | ||
round | 是否为圆角按钮 | ||
icon | 图标组件 | ||
loading | 是否为加载中状态 |
Button Slots
插槽名 | 说明 |
---|---|
default | 自定义默认内容 |
loading | 自定义加载中组件 |
icon | 自定义图标组件 |