blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

breaking change: rename Info to Badge

Browse Source
This commit is contained in:
chenjiahan 2020-08-20 19:36:12 +08:00
parent 4e5f509b2f
commit 63bd4700ab
40 changed files with 157 additions and 178 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components.js
View File

@ -4,7 +4,7 @@ module.exports = [
'cell',
'cell-group',
'icon',
'info',
'badge',
'image',
'col',
'row',

11
src/action-bar-icon/index.js
View File

@ -1,8 +1,8 @@
import { createNamespace, isDef } from '../utils';
import { createNamespace } from '../utils';
import { route, routeProps } from '../utils/router';
import { ChildrenMixin } from '../mixins/relation';
import Info from '../info';
import Icon from '../icon';
import Badge from '../badge';
const [createComponent, bem] = createNamespace('action-bar-icon');
@ -15,7 +15,6 @@ export default createComponent({
text: String,
icon: String,
color: String,
info: [Number, String],
badge: [Number, String],
iconClass: null,
},
@ -29,13 +28,11 @@ export default createComponent({
},
genIcon() {
const info = isDef(this.badge) ? this.badge : this.info;
if (this.$slots.icon) {
return (
<div class={bem('icon')}>
{this.$slots.icon()}
<Info dot={this.dot} info={info} />
<Badge dot={this.dot} badge={this.badge} />
</div>
);
}
@ -45,8 +42,8 @@ export default createComponent({
class={[bem('icon'), this.iconClass]}
tag="div"
dot={this.dot}
info={info}
name={this.icon}
badge={this.badge}
color={this.color}
/>
);

1
src/action-bar/README.zh-CN.md
View File

@ -98,7 +98,6 @@ export default {
| icon-class | 图标额外类名 | _any_ | - |
| dot `2.5.5` | 是否显示图标右上角小红点 | _boolean_ | `false` |
| badge `v2.5.6` | 图标右上角徽标的内容 | _number \| string_ | - |
| info | 图标右上角徽标的内容（已废弃，请使用 badge 属性） | _number \| string_ | - |
| url | 点击后跳转的链接地址 | _string_ | - |
| to | 点击后跳转的目标路由对象，同 vue-router 的 [to 属性](https://router.vuejs.org/zh/api/#to) | _string \| object_ | - |
| replace | 是否在跳转时替换当前页面历史 | _boolean_ | `false` |

6
src/action-bar/test/__snapshots__/demo.spec.js.snap
View File

@ -27,17 +27,17 @@ exports[`renders demo correctly 1`] = `
<div class="van-action-bar">
<div role="button" tabindex="0" class="van-action-bar-icon">
<div class="van-icon van-icon-chat-o van-action-bar-icon__icon">
<div class="van-info van-info--dot"></div>
<div class="van-badge van-badge--dot"></div>
</div>客服
</div>
<div role="button" tabindex="0" class="van-action-bar-icon">
<div class="van-icon van-icon-cart-o van-action-bar-icon__icon">
<div class="van-info">5</div>
<div class="van-badge">5</div>
</div>购物车
</div>
<div role="button" tabindex="0" class="van-action-bar-icon">
<div class="van-icon van-icon-shop-o van-action-bar-icon__icon">
<div class="van-info">12</div>
<div class="van-badge">12</div>
</div>店铺
</div> <button class="van-button van-button--warning van-button--large van-action-bar-button van-action-bar-button--first van-action-bar-button--warning">
<div class="van-button__content"><span class="van-button__text">加入购物车</span></div>

6
src/action-bar/test/__snapshots__/index.spec.js.snap
View File

@ -24,14 +24,14 @@ exports[`Icon render icon slot 1`] = `
exports[`Icon render icon slot with dot 1`] = `
<div role="button" tabindex="0" class="van-action-bar-icon">
<div class="van-action-bar-icon__icon">Custom Icon<div class="van-info van-info--dot"></div>
<div class="van-action-bar-icon__icon">Custom Icon<div class="van-badge van-badge--dot"></div>
</div>Text
</div>
`;
exports[`Icon render icon slot with info 1`] = `
exports[`Icon render icon slot with badge 1`] = `
<div role="button" tabindex="0" class="van-action-bar-icon">
<div class="van-action-bar-icon__icon">Custom Icon<div class="van-info">1</div>
<div class="van-action-bar-icon__icon">Custom Icon<div class="van-badge">1</div>
</div>Text
</div>
`;

4
src/action-bar/test/index.spec.js
View File

@ -50,12 +50,12 @@ test('Icon render icon slot', () => {
expect(wrapper).toMatchSnapshot();
});
test('Icon render icon slot with info', () => {
test('Icon render icon slot with badge', () => {
const wrapper = mount({
render(h) {
return h(Icon, {
props: {
info: '1',
badge: '1',
},
scopedSlots: {
default: () => 'Text',

21
src/badge/index.js Normal file
View File

@ -0,0 +1,21 @@
import { isDef, createNamespace } from '../utils';
const [createComponent, bem] = createNamespace('badge');
export default createComponent({
props: {
dot: Boolean,
badge: [Number, String],
},
render() {
const { dot, badge } = this;
const showBadge = isDef(badge) && badge !== '';
if (!dot && !showBadge) {
return;
}
return <div class={bem({ dot })}>{dot ? '' : badge}</div>;
},
});

29
src/badge/index.less Normal file
View File

@ -0,0 +1,29 @@
@import '../style/var';
.van-badge {
position: absolute;
top: 0;
right: 0;
box-sizing: border-box;
min-width: @badge-size;
padding: @badge-padding;
color: @badge-color;
font-weight: @badge-font-weight;
font-size: @badge-font-size;
font-family: @badge-font-family;
line-height: 1.2;
text-align: center;
background-color: @badge-background-color;
border: @badge-border-width solid @white;
border-radius: @badge-size;
transform: translate(50%, -50%);
transform-origin: 100%;
&--dot {
width: @badge-dot-size;
min-width: 0;
height: @badge-dot-size;
background-color: @badge-dot-color;
border-radius: 100%;
}
}

7
src/badge/test/__snapshots__/index.spec.js.snap Normal file
View File

@ -0,0 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`should not render when badge is empty string 1`] = ``;
exports[`should not render when badge is empty undefined 1`] = ``;
exports[`should render when badge is zero 1`] = `<div class="van-badge">0</div>`;

32
src/badge/test/index.spec.js Normal file
View File

@ -0,0 +1,32 @@
import Badge from '..';
import { mount } from '../../../test';
test('should not render when badge is empty string', () => {
const wrapper = mount(Badge, {
propsData: {
badge: '',
},
});
expect(wrapper).toMatchSnapshot();
});
test('should not render when badge is empty undefined', () => {
const wrapper = mount(Badge, {
propsData: {
badge: undefined,
},
});
expect(wrapper).toMatchSnapshot();
});
test('should render when badge is zero', () => {
const wrapper = mount(Badge, {
propsData: {
badge: 0,
},
});
expect(wrapper).toMatchSnapshot();
});

8
src/grid-item/index.js
View File

@ -7,8 +7,8 @@ import { route, routeProps } from '../utils/router';
import { ChildrenMixin } from '../mixins/relation';
// Components
import Info from '../info';
import Icon from '../icon';
import Badge from '../badge';
const [createComponent, bem] = createNamespace('grid-item');
@ -75,7 +75,7 @@ export default createComponent({
return (
<div class={bem('icon-wrapper')}>
{this.$slots.icon()}
<Info dot={this.dot} info={this.badge} />
<Badge dot={this.dot} badge={this.badge} />
</div>
);
}
@ -83,10 +83,10 @@ export default createComponent({
if (this.icon) {
return (
<Icon
name={this.icon}
dot={this.dot}
info={this.badge}
name={this.icon}
size={this.parent.iconSize}
badge={this.badge}
class={bem('icon')}
classPrefix={this.iconPrefix}
/>

1
src/grid/README.zh-CN.md
View File

@ -135,7 +135,6 @@ Vue.use(GridItem);
| icon-prefix `v2.5.3` | 图标类名前缀，同 Icon 组件的 [class-prefix 属性](#/zh-CN/icon#props) | _string_ | `van-icon` |
| dot `v2.2.1` | 是否显示图标右上角小红点 | _boolean_ | `false` |
| badge `v2.5.6` | 图标右上角徽标的内容 | _number \| string_ | - |
| info `2.2.1` | 图标右上角徽标的内容（已废弃，请使用 badge 属性） | _number \| string_ | - |
| url | 点击后跳转的链接地址 | _string_ | - |
| to | 点击后跳转的目标路由对象，同 vue-router 的 [to 属性](https://router.vuejs.org/zh/api/#to) | _string \| object_ | - |
| replace | 是否在跳转时替换当前页面历史 | _boolean_ | `false` |

4
src/grid/test/__snapshots__/demo.spec.js.snap
View File

@ -182,12 +182,12 @@ exports[`renders demo correctly 1`] = `
<div class="van-grid van-hairline--top">
<div class="van-grid-item" style="flex-basis: 50%;">
<div class="van-grid-item__content van-grid-item__content--center van-hairline"><i class="van-icon van-icon-home-o van-grid-item__icon">
<div class="van-info van-info--dot"></div>
<div class="van-badge van-badge--dot"></div>
</i><span class="van-grid-item__text">文字</span></div>
</div>
<div class="van-grid-item" style="flex-basis: 50%;">
<div class="van-grid-item__content van-grid-item__content--center van-hairline"><i class="van-icon van-icon-search van-grid-item__icon">
<div class="van-info">99+</div>
<div class="van-badge">99+</div>
</i><span class="van-grid-item__text">文字</span></div>
</div>
</div>

2
src/grid/test/__snapshots__/index.spec.js.snap
View File

@ -15,7 +15,7 @@ exports[`render icon-slot 1`] = `
<div class="van-grid-item__content van-grid-item__content--center van-hairline">
<div class="van-grid-item__icon-wrapper">
<div>Custom Icon</div>
<div class="van-info">1</div>
<div class="van-badge">1</div>
</div>
</div>
</div>

2
src/grid/test/index.spec.js
View File

@ -49,7 +49,7 @@ test('render icon-slot', () => {
const wrapper = mount({
template: `
<van-grid icon-size="10">
<van-grid-item info="1">
<van-grid-item badge="1">
<template #icon>
<div>Custom Icon</div>
</template>

1
src/icon/README.zh-CN.md
View File

@ -93,7 +93,6 @@ import 'vant/lib/icon/local.css';
| name | 图标名称或图片链接 | _string_ | - |
| dot `v2.2.1` | 是否显示图标右上角小红点 | _boolean_ | `false` |
| badge `v2.5.6` | 图标右上角徽标的内容 | _number \| string_ | - |
| info | 图标右上角徽标的内容（已废弃，请使用 badge 属性） | _number \| string_ | - |
| color | 图标颜色 | _string_ | `inherit` |
| size | 图标大小，如 `20px` `2em`，默认单位为`px` | _number \| string_ | `inherit` |
| class-prefix | 类名前缀，用于使用自定义图标 | _string_ | `van-icon` |

12
src/icon/index.js
View File

@ -1,8 +1,5 @@
// Utils
import { addUnit, createNamespace } from '../utils';
// Components
import Info from '../info';
import Badge from '../badge';
const [createComponent, bem] = createNamespace('icon');
@ -44,11 +41,8 @@ export default createComponent({
>
{this.$slots.default?.()}
{imageIcon && <img class={bem('image')} src={name} />}
<Info
dot={this.dot}
info={this.badge}
/>
<Badge dot={this.dot} badge={this.badge} />
</this.tag>
);
}
},
});

2
src/icon/test/__snapshots__/index.spec.js.snap
View File

@ -2,7 +2,7 @@
exports[`dot prop 1`] = `
<i class="van-icon van-icon-undefined">
<div class="van-info van-info--dot"></div>
<div class="van-badge van-badge--dot"></div>
</i>
`;

22
src/info/index.js
View File

@ -1,22 +0,0 @@
// Utils
import { isDef, createNamespace } from '../utils';
const [createComponent, bem] = createNamespace('info');
export default createComponent({
props: {
dot: Boolean,
info: [Number, String],
},
render() {
const { dot, info } = this;
const showInfo = isDef(info) && info !== '';
if (!dot && !showInfo) {
return;
}
return <div class={bem({ dot })}>{dot ? '' : info}</div>;
},
});

29
src/info/index.less
View File

@ -1,29 +0,0 @@
@import '../style/var';
.van-info {
position: absolute;
top: 0;
right: 0;
box-sizing: border-box;
min-width: @info-size;
padding: @info-padding;
color: @info-color;
font-weight: @info-font-weight;
font-size: @info-font-size;
font-family: @info-font-family;
line-height: 1.2;
text-align: center;
background-color: @info-background-color;
border: @info-border-width solid @white;
border-radius: @info-size;
transform: translate(50%, -50%);
transform-origin: 100%;
&--dot {
width: @info-dot-size;
min-width: 0;
height: @info-dot-size;
background-color: @info-dot-color;
border-radius: 100%;
}
}

7
src/info/test/__snapshots__/index.spec.js.snap
View File

@ -1,7 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`should not render when info is empty string 1`] = ``;
exports[`should not render when info is empty undefined 1`] = ``;
exports[`should render when info is zero 1`] = `<div class="van-info">0</div>`;

32
src/info/test/index.spec.js
View File

@ -1,32 +0,0 @@
import Info from '..';
import { mount } from '../../../test';
test('should not render when info is empty string', () => {
const wrapper = mount(Info, {
propsData: {
info: '',
},
});
expect(wrapper).toMatchSnapshot();
});
test('should not render when info is empty undefined', () => {
const wrapper = mount(Info, {
propsData: {
info: undefined,
},
});
expect(wrapper).toMatchSnapshot();
});
test('should render when info is zero', () => {
const wrapper = mount(Info, {
propsData: {
info: 0,
},
});
expect(wrapper).toMatchSnapshot();
});

4
src/sidebar-item/index.js
View File

@ -1,7 +1,7 @@
import { createNamespace } from '../utils';
import { ChildrenMixin } from '../mixins/relation';
import { route, routeProps } from '../utils/router';
import Info from '../info';
import Badge from '../badge';
const [createComponent, bem] = createNamespace('sidebar-item');
@ -45,7 +45,7 @@ export default createComponent({
>
<div class={bem('text')}>
{this.title}
<Info dot={this.dot} info={this.badge} class={bem('info')} />
<Badge dot={this.dot} badge={this.badge} class={bem('badge')} />
</div>
</a>
);

1
src/sidebar/README.zh-CN.md
View File

@ -108,7 +108,6 @@ export default {
| title | 内容 | _string_ | `''` |
| dot `v2.2.1` | 是否显示右上角小红点 | _boolean_ | `false` |
| badge `v2.5.6` | 图标右上角徽标的内容 | _number \| string_ | - |
| info | 图标右上角徽标的内容（已废弃，请使用 badge 属性） | _number \| string_ | - |
| disabled `v2.2.0` | 是否禁用该项 | _boolean_ | `false` |
| url | 点击后跳转的链接地址 | _string_ | - |
| to `v2.0.4` | 点击后跳转的目标路由对象，同 vue-router 的 [to 属性](https://router.vuejs.org/zh/api/#to) | _string \| object_ | - |

6
src/sidebar/test/__snapshots__/demo.spec.js.snap
View File

@ -25,13 +25,13 @@ exports[`renders demo correctly 1`] = `
<div class="van-grid-item__content van-grid-item__content--center">
<h3 class="demo-sidebar-title">徽标提示</h3>
<div class="van-sidebar"><a class="van-sidebar-item van-sidebar-item--select">
<div class="van-sidebar-item__text">标签名<div class="van-info van-info--dot van-sidebar-item__info"></div>
<div class="van-sidebar-item__text">标签名<div class="van-badge van-badge--dot van-sidebar-item__badge"></div>
</div>
</a> <a class="van-sidebar-item">
<div class="van-sidebar-item__text">标签名<div class="van-info van-sidebar-item__info">5</div>
<div class="van-sidebar-item__text">标签名<div class="van-badge van-sidebar-item__badge">5</div>
</div>
</a> <a class="van-sidebar-item">
<div class="van-sidebar-item__text">标签名<div class="van-info van-sidebar-item__info">99+</div>
<div class="van-sidebar-item__text">标签名<div class="van-badge van-sidebar-item__badge">99+</div>
</div>
</a></div>
</div>

24
src/style/var.less
View File

@ -113,6 +113,18 @@
@address-list-item-radio-icon-color: @red;
@address-list-edit-icon-size: 20px;
// Badge
@badge-size: 16px;
@badge-color: @white;
@badge-padding: 0 3px;
@badge-font-size: @font-size-sm;
@badge-font-weight: @font-weight-bold;
@badge-border-width: @border-width-base;
@badge-background-color: @red;
@badge-dot-color: @red;
@badge-dot-size: 8px;
@badge-font-family: -apple-system-font, Helvetica Neue, Arial, sans-serif;
// Button
@button-mini-height: 24px;
@button-mini-font-size: @font-size-xs;
@ -409,18 +421,6 @@
@index-bar-index-line-height: @line-height-xs;
@index-bar-index-active-color: @green;
// Info
@info-size: 16px;
@info-color: @white;
@info-padding: 0 3px;
@info-font-size: @font-size-sm;
@info-font-weight: @font-weight-bold;
@info-border-width: @border-width-base;
@info-background-color: @red;
@info-dot-color: @red;
@info-dot-size: 8px;
@info-font-family: -apple-system-font, Helvetica Neue, Arial, sans-serif;
// Image
@image-placeholder-text-color: @gray-6;
@image-placeholder-font-size: @font-size-md;

1
src/tab/README.zh-CN.md
View File

@ -254,7 +254,6 @@ export default {
| disabled | 是否禁用标签 | _boolean_ | `false` |
| dot `v2.3.0` | 是否在标题右上角显示小红点 | _boolean_ | `false` |
| badge `v2.5.6` | 图标右上角徽标的内容 | _number \| string_ | - |
| info `v2.3.0` | 图标右上角徽标的内容（已废弃，请使用 badge 属性） | _number \| string_ | - |
| name `v2.0.6` | 标签名称，作为匹配的标识符 | _number \| string_ | 标签的索引值 |
| url `v2.2.1` | 点击后跳转的链接地址 | _string_ | - |
| to `v2.2.1` | 点击后跳转的目标路由对象，同 vue-router 的 [to 属性](https://router.vuejs.org/zh/api/#to) | _string \| object_ | - |

1
src/tab/index.js
View File

@ -11,7 +11,6 @@ export default createComponent({
...routeProps,
dot: Boolean,
name: [Number, String],
info: [Number, String],
badge: [Number, String],
title: String,
titleStyle: null,

6
src/tab/test/__snapshots__/index.spec.js.snap
View File

@ -105,7 +105,7 @@ exports[`dot prop 1`] = `
<div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text-wrapper"><span class="van-tab__text van-tab__text--ellipsis"></span>
<div class="van-info van-info--dot"></div>
<div class="van-badge van-badge--dot"></div>
</span></div>
<div class="van-tabs__line"></div>
</div>
@ -116,12 +116,12 @@ exports[`dot prop 1`] = `
</div>
`;
exports[`info prop 1`] = `
exports[`badge prop 1`] = `
<div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text-wrapper"><span class="van-tab__text van-tab__text--ellipsis"></span>
<div class="van-info">10</div>
<div class="van-badge">10</div>
</span></div>
<div class="van-tabs__line"></div>
</div>

4
src/tab/test/index.spec.js
View File

@ -246,11 +246,11 @@ test('dot prop', () => {
expect(wrapper).toMatchSnapshot();
});
test('info prop', () => {
test('badge prop', () => {
const wrapper = mount({
template: `
<van-tabs>
<van-tab info="10">Text</van-tab>
<van-tab badge="10">Text</van-tab>
</van-tabs>
`,
});

8
src/tabbar-item/index.js
View File

@ -7,7 +7,7 @@ import { ChildrenMixin } from '../mixins/relation';
// Components
import Icon from '../icon';
import Info from '../info';
import Badge from '../badge';
const [createComponent, bem] = createNamespace('tabbar-item');
@ -19,7 +19,6 @@ export default createComponent({
dot: Boolean,
icon: String,
name: [Number, String],
info: [Number, String],
badge: [Number, String],
iconPrefix: String,
},
@ -71,10 +70,7 @@ export default createComponent({
<div class={bem({ active })} style={{ color }} onClick={this.onClick}>
<div class={bem('icon')}>
{this.genIcon(active)}
<Info
dot={this.dot}
info={isDef(this.badge) ? this.badge : this.info}
/>
<Badge dot={this.dot} badge={this.badge} />
</div>
<div class={bem('text')}>
{this.$slots.default ? this.$slots.default({ active }) : null}

2
src/tabbar-item/index.less
View File

@ -31,7 +31,7 @@
color: @tabbar-item-active-color;
}
.van-info {
.van-badge {
margin-top: @padding-base;
}
}

1
src/tabbar/README.zh-CN.md
View File

@ -184,7 +184,6 @@ export default {
| icon-prefix `v2.5.3` | 图标类名前缀，同 Icon 组件的 [class-prefix 属性](#/zh-CN/icon#props) | _string_ | `van-icon` |
| dot | 是否显示图标右上角小红点 | _boolean_ | `false` |
| badge `v2.5.6` | 图标右上角徽标的内容 | _number \| string_ | - |
| info | 图标右上角徽标的内容（已废弃，请使用 badge 属性） | _number \| string_ | - |
| url | 点击后跳转的链接地址 | _string_ | - |
| to | 点击后跳转的目标路由对象，同 vue-router 的 [to 属性](https://router.vuejs.org/zh/api/#to) | _string \| object_ | - |
| replace | 是否在跳转时替换当前页面历史 | _boolean_ | `false` |

8
src/tabbar/test/__snapshots__/demo.spec.js.snap
View File

@ -86,14 +86,14 @@ exports[`renders demo correctly 1`] = `
<div class="van-tabbar-item">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-search">
<!----></i>
<div class="van-info van-info--dot"></div>
<div class="van-badge van-badge--dot"></div>
</div>
<div class="van-tabbar-item__text">标签</div>
</div>
<div class="van-tabbar-item">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-friends-o">
<!----></i>
<div class="van-info">5</div>
<div class="van-badge">5</div>
</div>
<div class="van-tabbar-item__text">
标签
@ -102,7 +102,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-tabbar-item">
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-setting-o">
<!----></i>
<div class="van-info">20</div>
<div class="van-badge">20</div>
</div>
<div class="van-tabbar-item__text">
标签
@ -114,7 +114,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
<div class="van-tabbar-item van-tabbar-item--active">
<div class="van-tabbar-item__icon"><img src="https://img.yzcdn.cn/vant/user-active.png">
<div class="van-info">3</div>
<div class="van-badge">3</div>
</div>
<div class="van-tabbar-item__text"><span>自定义</span></div>
</div>

8
src/tabs/Title.js
View File

@ -1,5 +1,5 @@
import { createNamespace, isDef } from '../utils';
import Info from '../info';
import Badge from '../badge';
const [createComponent, bem] = createNamespace('tab');
@ -7,9 +7,9 @@ export default createComponent({
props: {
dot: Boolean,
type: String,
info: [Number, String],
color: String,
title: String,
badge: [Number, String],
isActive: Boolean,
disabled: Boolean,
scrollable: Boolean,
@ -59,11 +59,11 @@ export default createComponent({
</span>
);
if (this.dot || (isDef(this.info) && this.info !== '')) {
if (this.dot || (isDef(this.badge) && this.badge !== '')) {
return (
<span class={bem('text-wrapper')}>
{Text}
{<Info dot={this.dot} info={this.info} />}
{<Badge dot={this.dot} badge={this.badge} />}
</span>
);
}

2
src/tabs/index.js
View File

@ -373,7 +373,7 @@ export default createComponent({
}}
dot={item.dot}
type={type}
info={isDef(item.badge) ? item.badge : item.info}
badge={item.badge}
title={item.title}
color={this.color}
style={item.titleStyle}

4
src/tree-select/index.js
View File

@ -1,5 +1,5 @@
// Utils
import { createNamespace, addUnit, isDef } from '../utils';
import { createNamespace, addUnit } from '../utils';
// Components
import Icon from '../icon';
@ -58,8 +58,8 @@ export default createComponent({
const Navs = items.map((item) => (
<SidebarItem
dot={item.dot}
info={isDef(item.badge) ? item.badge : item.info}
title={item.text}
badge={item.badge}
disabled={item.disabled}
class={[bem('nav-item'), item.className]}
/>

4
src/tree-select/test/__snapshots__/demo.spec.js.snap
View File

@ -71,10 +71,10 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-tree-select" style="height: 55vw;">
<div class="van-sidebar van-tree-select__nav"><a class="van-sidebar-item van-sidebar-item--select van-tree-select__nav-item">
<div class="van-sidebar-item__text">浙江<div class="van-info van-info--dot van-sidebar-item__info"></div>
<div class="van-sidebar-item__text">浙江<div class="van-badge van-badge--dot van-sidebar-item__badge"></div>
</div>
</a><a class="van-sidebar-item van-tree-select__nav-item">
<div class="van-sidebar-item__text">江苏<div class="van-info van-sidebar-item__info">5</div>
<div class="van-sidebar-item__text">江苏<div class="van-badge van-sidebar-item__badge">5</div>
</div>
</a></div>
<div class="van-tree-select__content">

4
src/tree-select/test/__snapshots__/index.spec.js.snap
View File

@ -25,10 +25,10 @@ exports[`height prop 1`] = `
</div>
`;
exports[`nav info 1`] = `
exports[`nav badge 1`] = `
<div class="van-tree-select" style="height: 300px;">
<div class="van-sidebar van-tree-select__nav"><a class="van-sidebar-item van-sidebar-item--select van-tree-select__nav-item">
<div class="van-sidebar-item__text">group1<div class="van-info van-sidebar-item__info">3</div>
<div class="van-sidebar-item__text">group1<div class="van-badge van-sidebar-item__badge">3</div>
</div>
</a></div>
<div class="van-tree-select__content"></div>

4
src/tree-select/test/index.spec.js
View File

@ -151,13 +151,13 @@ test('height prop', () => {
expect(wrapper).toMatchSnapshot();
});
test('nav info', () => {
test('nav badge', () => {
const wrapper = mount(TreeSelect, {
propsData: {
items: [
{
text: 'group1',
info: 3,
badge: 3,
},
],
},