feat(TreeSelect): add badge option, mark info option as deprecated

src/sidebar/test/__snapshots__/demo.spec.js.snap

@@ -23,7 +23,7 @@ exports[`renders demo correctly 1`] = `
     </div>
     <div class="van-grid-item" style="flex-basis: 50%;">
       <div class="van-grid-item__content van-grid-item__content--center">
-        <h3 class="demo-sidebar-title">提示信息</h3>
+        <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>

src/tree-select/README.md

@@ -81,7 +81,7 @@ export default {
 }
 ```
 
-### Show Info
+### Show Badge
 
 ```html
 <van-tree-select
@@ -98,7 +98,7 @@ export default {
       activeIndex: 0,
       items: [
         { text: 'Group 1', children: [], dot: true },
-        { text: 'Group 2', children: [], info: 5 }
+        { text: 'Group 2', children: [], badge: 5 }
       ]
     }
   }
@@ -141,8 +141,8 @@ In every tree object, `text` property defines `id` stands for the unique key whi
   {
     // name of the parent node
     text: 'Group 1',
-    // info
-    info: 3,
+    // badge
+    badge: 3,
     // Whether to show red dot
     dot: true,
     // ClassName of parent node

src/tree-select/README.zh-CN.md

@@ -87,9 +87,9 @@ export default {
 }
 ```
 
-### 提示信息
+### 徽标提示
 
-设置`dot`属性后，会在图标右上角展示一个小红点。设置`info`属性后，会在图标右上角展示相应的徽标
+设置`dot`属性后，会在图标右上角展示一个小红点。设置`badge`属性后，会在图标右上角展示相应的徽标
 
 ```html
 <van-tree-select
@@ -106,7 +106,7 @@ export default {
       activeIndex: 0,
       items: [
         { text: '浙江', children: [], dot: true },
-        { text: '江苏', children: [], info: 5 }
+        { text: '江苏', children: [], badge: 5 }
       ]
     }
   }
@@ -147,8 +147,8 @@ export default {
   {
     // 导航名称
     text: '所有城市',
-    // 导航名称右上角徽标
-    info: 3,
+    // 导航名称右上角徽标，2.5.6 版本开始支持
+    badge: 3,
     // 是否在导航名称右上角显示小红点
     dot: true,
     // 导航节点额外类名

src/tree-select/demo/index.vue

@@ -35,10 +35,10 @@
       </van-tree-select>
     </demo-block>
 
-    <demo-block :title="$t('showInfo')">
+    <demo-block :title="$t('showBadge')">
       <van-tree-select
         height="55vw"
-        :items="infoItems"
+        :items="badgeItems"
         :active-id.sync="activeId2"
         :main-active-index.sync="activeIndex4"
       />
@@ -54,7 +54,7 @@ import { deepClone } from '../../utils/deep-clone';
 export default {
   i18n: {
     'zh-CN': {
-      showInfo: '提示信息',
+      showBadge: '提示信息',
       radioMode: '单选模式',
       multipleMode: '多选模式',
       customContent: '自定义内容',
@@ -62,7 +62,7 @@ export default {
       dataSimple: [{ text: '分组 1' }, { text: '分组 2' }],
     },
     'en-US': {
-      showInfo: 'Show Info',
+      showBadge: 'Show Badge',
       radioMode: 'Radio Mode',
       multipleMode: 'Multiple Mode',
       customContent: 'Custom Content',
@@ -92,11 +92,11 @@ export default {
       return this.$t('dataSimple');
     },
 
-    infoItems() {
+    badgeItems() {
       const data = deepClone(this.$t('data')).slice(0, 2);
 
       data[0].dot = true;
-      data[1].info = 5;
+      data[1].badge = 5;
 
       return data;
     },

src/tree-select/index.tsx

@@ -1,5 +1,5 @@
 // Utils
-import { createNamespace, addUnit } from '../utils';
+import { createNamespace, addUnit, isDef } from '../utils';
 import { emit, inherit } from '../utils/functional';
 
 // Components
@@ -15,6 +15,7 @@ export type TreeSelectItem = {
   text: string;
   dot?: boolean;
   info?: string | number;
+  badge?: string | number;
   disabled?: boolean;
   className?: any;
   children: TreeSelectChildren[];
@@ -63,7 +64,7 @@ function TreeSelect(
   const Navs = items.map(item => (
     <SidebarItem
       dot={item.dot}
-      info={item.info}
+      info={isDef(item.badge) ? item.badge : item.info}
       title={item.text}
       disabled={item.disabled}
       class={[bem('nav-item'), item.className]}