feat(TabbarItem): add badge prop, mark info prop as deprecated

src/tabbar-item/index.js

@@ -20,6 +20,7 @@ export default createComponent({
     icon: String,
     name: [Number, String],
     info: [Number, String],
+    badge: [Number, String],
     iconPrefix: String,
   },
 
@@ -70,7 +71,10 @@ export default createComponent({
       <div class={bem({ active })} style={{ color }} onClick={this.onClick}>
         <div class={bem('icon')}>
           {this.genIcon(active)}
-          <Info dot={this.dot} info={this.info} />
+          <Info
+            dot={this.dot}
+            info={isDef(this.badge) ? this.badge : this.info}
+          />
         </div>
         <div class={bem('text')}>{this.slots('default', { active })}</div>
       </div>

src/tabbar/README.md

@@ -60,8 +60,8 @@ export default {
 <van-tabbar v-model="active">
   <van-tabbar-item icon="home-o">Tab</van-tabbar-item>
   <van-tabbar-item icon="search" dot>Tab</van-tabbar-item>
-  <van-tabbar-item icon="friends-o" info="5">Tab</van-tabbar-item>
+  <van-tabbar-item icon="friends-o" badge="5">Tab</van-tabbar-item>
-  <van-tabbar-item icon="setting-o" info="20">Tab</van-tabbar-item>
+  <van-tabbar-item icon="setting-o" badge="20">Tab</van-tabbar-item>
 </van-tabbar>
 ```
 
@@ -71,7 +71,7 @@ Use `icon` slot to custom icon
 
 ```html
 <van-tabbar v-model="active">
-  <van-tabbar-item info="3">
+  <van-tabbar-item badge="3">
     <span>Custom</span>
     <img
       slot="icon"
@@ -181,7 +181,7 @@ export default {
 | icon | Icon name | *string* | - |
 | icon-prefix `v2.5.3` | Icon className prefix | *string* | `van-icon` |
 | dot | Whether to show red dot | *boolean* | - |
-| info | Content of the badge | *number \| string* | - |
+| badge `v2.5.6` | Content of the badge | *number \| string* | `''` |
 | url | Link | *string* | - |
 | to | Target route of the link, same as to of vue-router | *string \| object* | - |
 | replace | If true, the navigation will not leave a history record | *boolean* | `false` |

src/tabbar/README.zh-CN.md

@@ -58,16 +58,16 @@ export default {
 }
 ```
 
-### 提示信息
+### 徽标提示
 
-设置`dot`属性后，会在图标右上角展示一个小红点。设置`info`属性后，会在图标右上角展示相应的徽标
+设置`dot`属性后，会在图标右上角展示一个小红点。设置`badge`属性后，会在图标右上角展示相应的徽标
 
 ```html
 <van-tabbar v-model="active">
   <van-tabbar-item icon="home-o">标签</van-tabbar-item>
   <van-tabbar-item icon="search" dot>标签</van-tabbar-item>
-  <van-tabbar-item icon="friends-o" info="5">标签</van-tabbar-item>
+  <van-tabbar-item icon="friends-o" badge="5">标签</van-tabbar-item>
-  <van-tabbar-item icon="setting-o" info="20">标签</van-tabbar-item>
+  <van-tabbar-item icon="setting-o" badge="20">标签</van-tabbar-item>
 </van-tabbar>
 ```
 
@@ -77,7 +77,7 @@ export default {
 
 ```html
 <van-tabbar v-model="active">
-  <van-tabbar-item info="3">
+  <van-tabbar-item badge="3">
     <span>自定义</span>
     <img
       slot="icon"
@@ -188,7 +188,8 @@ export default {
 | icon | [图标名称](#/zh-CN/icon)或图片链接| *string* | - |
 | icon-prefix `v2.5.3` | 图标类名前缀，同 Icon 组件的 [class-prefix 属性](#/zh-CN/icon#props) | *string* | `van-icon` |
 | dot | 是否显示图标右上角小红点 | *boolean* | `false` |
-| info | 图标右上角徽标的内容 | *number \| string* | - |
+| 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` |

src/tabbar/demo/index.vue

@@ -30,10 +30,10 @@
       <van-tabbar v-model="active2">
         <van-tabbar-item icon="home-o">{{ $t('tab') }}</van-tabbar-item>
         <van-tabbar-item icon="search" dot>{{ $t('tab') }}</van-tabbar-item>
-        <van-tabbar-item icon="friends-o" info="5">
+        <van-tabbar-item icon="friends-o" badge="5">
           {{ $t('tab') }}
         </van-tabbar-item>
-        <van-tabbar-item icon="setting-o" info="20">
+        <van-tabbar-item icon="setting-o" badge="20">
           {{ $t('tab') }}
         </van-tabbar-item>
       </van-tabbar>
@@ -41,7 +41,7 @@
 
     <demo-block :title="$t('customIcon')">
       <van-tabbar v-model="active3">
-        <van-tabbar-item info="3">
+        <van-tabbar-item badge="3">
           <span>{{ $t('custom') }}</span>
           <template #icon="props">
             <img :src="props.active ? icon.active : icon.inactive" />
@@ -80,7 +80,7 @@
 export default {
   i18n: {
     'zh-CN': {
-      badge: '提示信息',
+      badge: '徽标提示',
       customIcon: '自定义图标',
       customColor: '自定义颜色',
       matchByName: '通过名称匹配',