通用/按钮

Button 按钮

按钮用于触发一个操作,如提交表单或打开对话框。不同样式的按钮可以传达不同的语义和优先级。

基本样式

按钮分为三种类型样式,分别为:System button(系统按钮)、Primary color button(主色按钮)、Warning button(警示按钮)。

按钮组合

按钮可以嵌入图标,通过 iconPosition 参数控制图标位置。设置 icon 而不设置 text 时,按钮宽高相等为方形。

按钮尺寸

按钮分为:小、中、大,三种尺寸;左侧 icon 尺寸分别为大 16、中 16、小 14。

按钮级别

按钮级别分为三个等级:Primary(一级)、Secondary(二级)、Tertiary(三级)。

禁用按钮

按钮的禁用状态。

API 参考

参数 说明 类型 可选值 默认值
text 按钮文字 string - 'button'
type 按钮类型 string 'button' | 'submit' | 'reset' 'button'
variant 按钮样式类型 string 'system' | 'primary' | 'warning' 'system'
level 按钮级别 string 'primary' | 'secondary' | 'tertiary' 'primary'
size 按钮尺寸 string 'large' | 'default' | 'small' 'large'
disabled 是否禁用 boolean true | false false
icon 图标 HTML string - null
iconPosition 图标位置 string 'left' | 'right' | 'only' 'left'
iconSize 图标尺寸(像素) number - null
onClick 点击事件回调 function - null
className 自定义类名 string - ''
id 自定义 id string - ''
dataState 自定义 data-state 属性 string - null