# cButton按钮组件
# 使用教程
# 使用文档
# 导入
main.js中：
import { cButton } from 'cpm-ui'
Vue.use(cButton)
1
2
2
# 调用
<cButton type="primary" size="large">primary</cButton>
1
# 属性props
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| type | 按钮类型 | String | default、primary、danger | default |
| size | 按钮大小，除large外其他均为行内 | String | smaller、small、normal、large | normal |
| circle | 是否开启圆角 | Boolean | true、false | false |
| btnStyle | 按钮样式，也可以通过css重置 | Object | {} | |
| plain | 是否为幽灵按钮，即有边框无背景色 | Boolean | true、false | false |
| disabled | 是否为禁用按钮，0.6不透明度 | Boolean | true、false | false |
# 事件Event
| 方法 | 说明 |
|---|---|
| onClick | 点击icon |
如：
<cButton type="primary" size="large" @onClick="onClick">primary</cButton>
1
# 插槽slot
按钮内容放置在插槽中，可设置icon等
<cButton>
<cIcon class="icon-left" type="search" size="1rem" style="margin-right:0.26rem;"></cIcon>搜索
</cButton>
1
2
3
2
3
或：
<cButton type="primary" size="large">
<img src="../assets/img/arrow-left.png" style="width:1.4rem;">上一页
</cButton>
1
2
3
2
3
# 特别提示
无