Button 按钮

基础通用组件,用于标记一组操作命令,由用户点击触发,响应用户并完成相应的业务逻辑。

代码示例#

API#

预设类型#

ts
type ButtonType = 'default' | 'primary' | 'info' | 'success' | 'warning' | 'error'
type ButtonAttrType = 'button' | 'submit' | 'reset'

Button 属性#

名称类型说明默认值始于
badgenumber | string设置内置徽标内容null2.0.4
blockboolean是否为块级元素,设置后宽度变为 100%false-
button-typeButtonAttrType设置原生 <button>type 属性'button'-
circleboolean设置是否为圆形按钮false-
colorstring设置按钮的主题色null2.0.0
dashedboolean设置是否为虚线边框按钮false2.0.0
disabledboolean设置是否为禁用状态false-
ghostboolean开启后,按钮将变成背景颜色透明的样式false-
iconVueComponent按钮的辅助图标,加载状态时会切换为加载图标''-
loadingboolean设置是否为加载状态false-
loading-effectstring设置加载中图标的效果动画false-
loading-iconVueComponent设置加载中的图标Spinner-
no-pulseboolean设置是否禁用点击后的脉冲效果false2.0.0
simpleboolean开启后,按钮将变为浅色系的简约风格false-
size'small' | 'default' | 'large'按钮的大小'default'-
tagstring设置按钮的渲染标签'button'2.0.0
textboolean设置是否为文本按钮false2.0.0
typeButtonType设置按钮类型'default'-

Button 事件#

名称说明参数始于
click左键点击按钮时触发, 返回点击的事件对象(event: MouseEvent)-

Button 插槽#

名称说明参数始于
default按钮的内容插槽--
icon按钮前置图标的插槽-2.0.0
loading加载图标的插槽,需要更多定制化加载图标效果时使用--