SuperAPI AI 工具集

el-button

前端与建站

查看项目

更新于 10-15 23:32

技能介绍

用途:Element Plus 的 el-button 按钮组件技能,在用户需要实现按钮、按钮组或定制按钮外观时调用。

主要能力:支持 default、primary、success、warning、danger、info 等类型;large、default、small 三种尺寸;plain、round、circle、dashed、text、link 等样式变体;loading、disabled 状态;自定义颜色并自动计算 hover/active 色;水平或垂直按钮组;前缀图标与自定义加载图标;自定义元素标签(button、a、router-link 等)。

使用方式:通过属性配置,如 type、size、plain、round、circle、dashed、loading、disabled、icon、color、dark、tag、native-type、auto-insert-space 等;插槽包括 default、loading、icon;ButtonGroup 支持 size、type、direction 属性。示例:<el-button type="primary">Primary</el-button>;<el-button-group direction="vertical">…</el-button-group>。

适用场景:表单提交与重置、对话框底部操作、异步提交的加载反馈、图标按钮、相关操作分组等。

限制与注意:type="text" 已废弃,应改用 text 属性;图标或加载状态可能导致按钮宽度变化,可设置固定宽度;自定义颜色在暗色模式下需加 dark 属性;仅图标按钮建议添加 aria-label。