blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-05 19:41:45 +08:00
Code Issues Projects Releases Wiki Activity

feat(sidebar): add new prop badge (#3564)

Browse Source
This commit is contained in:
rex 2020-08-26 19:33:30 +08:00 committed by GitHub
parent 7da66cfe95
commit 940e453888
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 16 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
example/pages/sidebar/index.wxml
View File

@ -12,8 +12,8 @@
<h3 class="demo-sidebar-title">徽标提示</h3>
<van-sidebar custom-class="custom-sidebar">
<van-sidebar-item title="标签名" dot />
<van-sidebar-item title="标签名" info="5" />
<van-sidebar-item title="标签名" info="99+" />
<van-sidebar-item title="标签名" badge="5" />
<van-sidebar-item title="标签名" badge="99+" />
</van-sidebar>
</van-grid-item>

1
packages/sidebar-item/index.ts
View File

@ -11,6 +11,7 @@ VantComponent({
props: {
dot: Boolean,
badge: null,
info: null,
title: String,
disabled: Boolean,

5
packages/sidebar-item/index.wxml
View File

@ -8,10 +8,9 @@
>
<view class="van-sidebar-item__text">
<van-info
wx:if="{{ info !== null || dot }}"
wx:if="{{ badge != null || info !== null || dot }}"
dot="{{ dot }}"
info="{{ info }}"
custom-style="right: 4px"
info="{{ badge != null ? badge : info }}"
/>
<view wx:if="{{ title }}">{{ title }}</view>
<slot wx:else name="title" />

19
packages/sidebar/README.md
View File

@ -37,13 +37,13 @@ Page({
### 徽标提示
设置`dot`属性后，会在右上角展示一个小红点。设置`dot`属性后，会在右上角展示相应的徽标
设置`dot`属性后，会在右上角展示一个小红点。设置`badge`属性后，会在右上角展示相应的徽标
```html
<van-sidebar active-key="{{ activeKey }}">
<van-sidebar-item title="标签名" dot />
<van-sidebar-item title="标签名" dot="5" />
<van-sidebar-item title="标签名" dot="99+" />
<van-sidebar-item title="标签名" badge="5" />
<van-sidebar-item title="标签名" badge="99+" />
</van-sidebar>
```
@ -109,12 +109,13 @@ Page({
### SidebarItem Props
| 参数 | 说明 | 类型 | 默认值 |
| -------- | -------------------- | ------------------ | ------- |
| title | 内容 | _string_ | `''` |
| dot | 是否显示右上角小红点 | _boolean_ | `false` |
| info | 提示消息 | _string \| number_ | `''` |
| disabled | 是否禁用该项 | _boolean_ | `false` |
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| title | 内容 | _string_ | `''` |
| dot | 是否显示右上角小红点 | _boolean_ | `false` |
| info | 图标右上角徽标的内容（已废弃，请使用 badge 属性） | _string \| number_ | `''` |
| badge `v1.5.0` | 图标右上角徽标的内容 | _string \| number_ | `''` |
| disabled | 是否禁用该项 | _boolean_ | `false` |
### SidebarItem Slot

2
packages/sidebar/index.ts
View File

@ -35,7 +35,7 @@ VantComponent({
this.currentActive = activeKey;
const stack = [];
const stack: Promise<unknown>[] = [];
if (currentActive !== activeKey && children[currentActive]) {
stack.push(children[currentActive].setActive(false));