跳到主要内容

button

Properties​

PropertyAttributeDescriptionTypeDefault
autoWidthauto-width启用自动宽度调整booleanfalse
circlecircle显示圆形按钮booleanfalse
contentcontent按钮文本内容string''
disableddisabled禁用按钮booleanfalse
ghostghost以幽灵风格显示按钮booleanfalse
iconicon在按钮中显示图标string''
loadingloading显示加载状态图标booleanfalse
plainplain应用朴素风格booleanfalse
roundround显示圆角按钮booleanfalse
sizesize按钮大小"big" | "medium" | "small"'medium'
suffixIconsuffix-icon显示按钮后缀图标string''
typetype按钮类型"" | "danger" | "info" | "primary" | "success" | "warning"''

Dependencies​

Used by​

air-card​

Example Usage​

1. 基本按钮(默认状态)​

展示一个最基本的按钮,依据 size, state 和 state 来调整外观。

Primary Button

2. 不同颜色的按钮​

展示不同颜色的按钮,涵盖 primary, success, info, warning, danger, ghost。

主按钮成功按钮信息按钮警告按钮危险按钮幽灵按钮

3. 不同大小的按钮展示​

size 属性的不同效果。你可以使用 small, medium, large 来展示不同的按钮大小。

small Buttonmedium ButtonLarge Button

4. 带图标的按钮​

展示带有图标的按钮,使用 icon,suffix-icon, 属性为按钮添加前后缀图标。

图标按钮后缀图标按钮双图标按钮

5. 不同样式按钮​

展示按钮处于按钮样式状态时的表现,使用 solid,outline,text,neo,default 属性。

实心按钮描边按钮文字按钮

6. 加载中、禁用、选中状态展示​

展示加载中、禁用、选中状态下的按钮,使用 loading,disabled,icon,selected等属性。

加载中禁用按钮禁用图标按钮选中按钮选中图标按钮