Doc: update component document && examples

This commit is contained in:
陈嘉涵
2017-08-31 15:18:54 +08:00
parent aff5da68e4
commit 3de9f86b47
16 changed files with 243 additions and 282 deletions

View File

@@ -1,6 +1,6 @@
<style>
.swipe-delete-btn {
background-color: #FF4444;
.van-cell-swipe__left,
.van-cell-swipe__right {
color: #FFFFFF;
font-size: 16px;
width: 65px;
@@ -9,15 +9,11 @@
text-align: center;
line-height: 44px;
}
.swipe-check-btn {
background-color: #84c483;
color: #FFFFFF;
font-size: 16px;
width: 65px;
height: 44px;
display: inline-block;
text-align: center;
line-height: 44px;
.van-cell-swipe__left {
background-color: #FF4444;
}
.van-cell-swipe__right {
background-color: #84c483;
}
</style>
## CellSwipe 滑动单元格
@@ -36,22 +32,21 @@ Vue.component(CellSwipe.name, CellSwipe);
:::demo 基础用法
```html
<van-cell-swipe :right-width="65" :left-width="65">
<span slot="left">选择</span>
<van-cell-group>
<van-cell title="单元格1" value="单元格1内容"></van-cell>
</van-cell-group>
<span slot="right" class="swipe-delete-btn">删除</span>
<span slot="left" class="swipe-check-btn">选择</span>
<span slot="right">删除</span>
</van-cell-swipe>
```
:::
### API
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| left-width | 左侧滑动按钮宽度 | `number` | 0 | |
| right-width | 右侧滑动按钮宽度 | `number` | 0 | |
| left-width | 左侧滑动区域宽度 | `Number` | `0` | - |
| right-width | 右侧滑动区域宽度 | `Number` | `0` | - |
### Slot