elementui button
基本用法
Element UI 的 Button 组件提供多种样式和功能，可以通过 type 属性设置按钮类型。常见类型包括 primary、success、info、warning、danger。
<el-button>默认按钮</el-button>
<el-button type="primary">主要按钮</el-button>
<el-button type="success">成功按钮</el-button>
<el-button type="info">信息按钮</el-button>
<el-button type="warning">警告按钮</el-button>
<el-button type="danger">危险按钮</el-button>禁用状态
通过 disabled 属性可以禁用按钮，使其不可点击。
<el-button disabled>禁用按钮</el-button>
<el-button type="primary" disabled>禁用主要按钮</el-button>图标按钮
使用 icon 属性可以为按钮添加图标，Element UI 内置了多种图标。
<el-button type="primary" icon="el-icon-search">搜索</el-button>
<el-button type="success" icon="el-icon-edit">编辑</el-button>按钮组
通过 el-button-group 可以将多个按钮组合在一起。
<el-button-group>
<el-button type="primary" icon="el-icon-arrow-left">上一页</el-button>
<el-button type="primary">下一页<i class="el-icon-arrow-right el-icon--right"></i></el-button>
</el-button-group>加载状态
通过 loading 属性可以设置按钮的加载状态，适用于异步操作。
<el-button type="primary" :loading="true">加载中</el-button>按钮尺寸
Element UI 提供三种按钮尺寸：medium、small、mini，通过 size 属性设置。
<el-button size="medium">中等按钮</el-button>
<el-button size="small">小型按钮</el-button>
<el-button size="mini">迷你按钮</el-button>自定义按钮
可以通过插槽或样式覆盖来自定义按钮的外观。
<el-button type="primary" class="custom-button">自定义按钮</el-button>
<style>
.custom-button {
background-color: #ff00ff;
border-color: #ff00ff;
}
</style>事件处理
按钮支持 click 事件，可以通过 @click 绑定事件处理函数。
<el-button type="primary" @click="handleClick">点击我</el-button>
<script>
export default {
methods: {
handleClick() {
alert('按钮被点击了');
}
}
}
</script>按钮属性
常用属性包括：
type：按钮类型size：按钮尺寸disabled：是否禁用icon：图标类名loading：加载状态plain：是否朴素按钮round：是否圆角按钮circle：是否圆形按钮
<el-button type="primary" plain round>朴素圆角按钮</el-button>
<el-button type="success" circle icon="el-icon-check"></el-button>
