# TitleBar标题栏
# 使用教程
# 使用文档
# 导入
main.js中：
import { cTitleBar } from 'cpm-ui'
Vue.use(cTitleBar)
1
2
2
# 调用
<cTitleBar title="标题" @onClickLeft="onClickLeft"></cTitleBar>
1
# 属性props
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| title | 当前title内容 | String | '' | |
| showBack | 否显示返回按钮 | Boolean | true、false | true |
| fullScreen | 是否为全屏状态，处理iOS刘海屏 | Boolean | true、false | false |
| wraperStyle | 重置样式 | Object | {} | |
| showBottomBorder | 是否显示下边框 | Boolean | true、false | false |
# 事件Event
| 方法 | 说明 |
|---|---|
| onClickLeft | 点击左侧返回按钮 |
| onClickRight | 点击右侧按钮 |
如：
<cTitleBar title="标题" @onClickLeft="onClickLeft" @onClickRight="onClickRight">
<div slot="right">下一页</div>
</cTitleBar>
1
2
3
2
3
# 插槽slot
| 方法 | 说明 |
|---|---|
| left | 左侧 |
| center | 中间 |
| right | 右侧 |
<cTitleBar title="带插槽">
<div slot="left">返回</div>
<div slot="center">标题</div>
<div slot="right">下一页</div>
</cTitleBar>
1
2
3
4
5
2
3
4
5
# 特别提示
无