- 快速开始
- REPL
- 基本
- Icons 示例
- Button 示例
- 表单
- Input 示例
- Textarea 示例
- Radio 单选框
- Checkbox 多选框
- Switch 示例
- Select 示例
- Cascader 示例
- Form 示例
- Upload 示例
- date-picker 示例
- Drag 拖动排序
- data 数据
- Table 表格
- Tree 树形控件
- SelectTree 树形选择控件
- Pagination 分页
- progress 示例
- Empty 空状态
- 提示
- Loading 示例
- MessageBox 示例
- Dialog 示例
- Alert 示例
- Notice 示例
- 导航 Navigation
- Tabs 标签页
- NavMenu 导航菜单
- Breadcrumb 面包屑
- 其它 Others
- Clock 示例
- Drawer 示例
- Collapse 示例
- Scrollbar 示例
- Carousel 示例
- CountTo 示例
- PreviewImage 示例

## BeButton 按钮

使用type、plain、round、disabled和circle属性来定义 Button 的样式。

    		import { BeButton } from '@brewer/beerui

    <div class='demo-list'>
    	<BeButton class='demo-button' type="default">默认按钮</BeButton>
    	<BeButton class='demo-button' type="primary">主要按钮</BeButton>
    	<BeButton class='demo-button' type="success">成功按钮</BeButton>
    	<BeButton class='demo-button' type="info">信息按钮</BeButton>
    	<BeButton class='demo-button' type="warning">警告按钮</BeButton>
    	<BeButton class='demo-button' type="danger">危险按钮</BeButton>
    </div>
    <div class='demo-list'>
    	<BeButton class='demo-button' type="default" round>圆角按钮</BeButton>
    	<BeButton class='demo-button' type="primary">主要按钮</BeButton>
    	<BeButton class='demo-button' type="success">成功按钮</BeButton>
    	<BeButton class='demo-button' type="info">信息按钮</BeButton>
    	<BeButton class='demo-button' type="warning">警告按钮</BeButton>
    	<BeButton class='demo-button' type="danger">危险按钮</BeButton>
    </div>
    <BeButton class='demo-button' disabled type="default" round>圆角按钮</BeButton>
    <BeButton class='demo-button' disabled type="primary" round>主要按钮</BeButton>
    <BeButton class='demo-button' disabled type="success" round>成功按钮</BeButton>
    <BeButton class='demo-button' disabled type="info" round>信息按钮</BeButton>
    <BeButton class='demo-button' disabled type="warning" round>警告按钮</BeButton>
    <BeButton class='demo-button' disabled type="danger" round>危险按钮</BeButton>
    <BeButton class='demo-button' icon='IconActivity' type="default" circle>
    	<BeIcon name='add' color='#000' />
    </BeButton>
    <BeButton class='demo-button' type="primary" circle>
    	<BeIcon name='books' color='#fff' />
    </BeButton>
    <BeButton class='demo-button' type="success" circle>
    	<BeIcon name='call' color='#fff' />
    </BeButton>
    <BeButton class='demo-button' type="info" circle>
    	<BeIcon name='chat' color='#fff' />
    </BeButton>
    <BeButton class='demo-button' type="warning" circle>
    	<BeIcon name='clear' color='#fff' />
    </BeButton>
    <BeButton class='demo-button' type="danger" circle>
    	<BeIcon name='cloud' color='#fff' />
    </BeButton>

显示代码

## 不同尺寸

额外的尺寸：medium、small、mini，通过设置size属性来配置它们。

    <div class='demo-list'>
    	<BeButton class='demo-button' type="default">默认按钮</BeButton>
    	<BeButton class='demo-button' type="default" size="medium">主要按钮</BeButton>
    	<BeButton class='demo-button' type="default" size="small">成功按钮</BeButton>
    	<BeButton class='demo-button' type="default" size="mini">信息按钮</BeButton>
    </div>
    <div class='demo-list'>
    	<BeButton class='demo-button' type="default" round>圆角按钮</BeButton>
    	<BeButton class='demo-button' type="default" size="medium" round>圆角按钮</BeButton>
    	<BeButton class='demo-button' type="default" size="small" round>圆角按钮</BeButton>
    	<BeButton class='demo-button' type="default" size="mini" round>圆角按钮</BeButton>
    </div>

显示代码

### Attributes

参数 | 说明 | 类型 | 可选值 | 默认值
--- | --- | --- | --- | ---
style | style标签 | string | - | ''
nativeType | 按钮type | string | - | button
disabled | 禁用 | boolean | true/false | false
circle | 圆形 | boolean | true/false | false
round | 圆角按钮 | boolean | true/false | false

### Slot

name | 说明
--- | ---
default | 默认slot