docs(Sidebar): update demo (#1917)

This commit is contained in:
neverland 2019-08-28 10:49:01 +08:00 committed by GitHub
parent afa3f4a2ad
commit 6a9822115d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 30 additions and 17 deletions

View File

@ -1,10 +1,15 @@
<demo-block title="基础用法"> <demo-block title="基础用法">
<view class="container"> <van-sidebar custom-class="custom-sidebar" bind:change="onChange">
<van-sidebar bind:change="onChange" custom-class="group"> <van-sidebar-item title="标签名称" />
<van-sidebar-item title="标签名称" /> <van-sidebar-item title="标签名称" />
<van-sidebar-item title="标签名称" info="8" /> <van-sidebar-item title="标签名称" />
<van-sidebar-item title="标签名称" info="99" /> </van-sidebar>
<van-sidebar-item title="标签名称" info="99+" /> </demo-block>
</van-sidebar>
</view> <demo-block title="显示徽标">
<van-sidebar custom-class="custom-sidebar" bind:change="onChange">
<van-sidebar-item title="标签名称" info="8" />
<van-sidebar-item title="标签名称" info="99" />
<van-sidebar-item title="标签名称" info="99+" />
</van-sidebar>
</demo-block> </demo-block>

View File

@ -1,10 +1,7 @@
.container { page {
width: auto;
margin: 0 15px;
padding: 20px 0;
background-color: #fff; background-color: #fff;
} }
.group { .custom-sidebar {
margin: 0 auto; margin-left: 15px;
} }

View File

@ -20,9 +20,8 @@
```html ```html
<van-sidebar active="{{ active }}" bind:change="onChange"> <van-sidebar active="{{ active }}" bind:change="onChange">
<van-sidebar-item title="标签名称" /> <van-sidebar-item title="标签名称" />
<van-sidebar-item title="标签名称" info="8" /> <van-sidebar-item title="标签名称" />
<van-sidebar-item title="标签名称" info="99" /> <van-sidebar-item title="标签名称" />
<van-sidebar-item title="标签名称" info="99+" />
</van-sidebar> </van-sidebar>
``` ```
@ -41,6 +40,18 @@ Page({
}); });
``` ```
### 显示徽标
通过`info`属性设置徽标内容
```html
<van-sidebar active="{{ active }}">
<van-sidebar-item title="标签名称" info="8" />
<van-sidebar-item title="标签名称" info="99" />
<van-sidebar-item title="标签名称" info="99+" />
</van-sidebar>
```
### Sidebar API ### Sidebar API
| 参数 | 说明 | 类型 | 默认值 | | 参数 | 说明 | 类型 | 默认值 |