主题文档
按钮组件
按钮组件提供了多种风格、尺寸和状态的按钮选择，支持图标和文字组合，以及加载状态。
按钮变体
通过设置 variant 属性可以切换不同的按钮样式：primary（默认）、outline、ghost 和 link。
按钮尺寸
通过设置 size 属性可以改变按钮大小：xs、sm、md（默认）、lg 和 xl。
按钮状态
按钮支持 disabled 禁用状态和 loading 加载状态，加载状态下会自动显示加载指示器并禁用点击。
带图标按钮
按钮支持通过 prefix-icon 和 suffix-icon 属性添加前置和后置图标，接受任何 iconify 图标格式，如 i-heroicons-plus。
全宽按钮
添加 full-width 属性可以创建宽度占满父容器的按钮，常用于移动设备或表单提交场景。
按钮颜色
通过 color 属性设置不同的按钮颜色：primary（默认）、secondary、success、warning、error 和 info。
常规风格不同颜色
轮廓风格不同颜色
轮廓按钮样式与不同颜色的组合应用。设置 variant="outline" 同时设置 color 属性。
幽灵风格不同颜色
幽灵按钮样式与不同颜色的组合应用。设置 variant="ghost" 同时设置 color 属性。
组件属性
| 属性 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| variant | 按钮的外观变体。可选值：'primary', 'outline', 'ghost', 'link' | string | primary |
| size | 按钮的大小。可选值：'xs', 'sm', 'md', 'lg', 'xl' | string | md |
| color | 按钮的颜色主题。可选值：'primary', 'secondary', 'success', 'warning', 'error', 'info' | string | primary |
| disabled | 是否禁用按钮 | boolean | false |
| loading | 是否显示加载状态 | boolean | false |
| full-width | 是否使按钮占据整个容器宽度 | boolean | false |
| prefix-icon | 按钮前的图标 | string | |
| suffix-icon | 按钮后的图标 | string |
设计赋能，创新无限