feat(TreeSelect): add className option (youzan#4671)

chenjiahan · web-flow · commit cc0364057691 · 2019-10-10T09:48:11.000+08:00
diff --git a/src/tree-select/README.md b/src/tree-select/README.md
@@ -145,6 +145,8 @@ In every tree object, `text` property defines `id` stands for the unique key whi
     info: 3,
     // Whether to show red dot
     dot: true,
+    // ClassName of parent node
+    className: 'my-class',
     // leaves of this parent node
     children: [
       {
diff --git a/src/tree-select/README.zh-CN.md b/src/tree-select/README.zh-CN.md
@@ -151,6 +151,8 @@ export default {
     info: 3,
     // 是否在导航名称右上角显示小红点
     dot: true,
+    // 导航节点额外类名
+    className: 'my-class',
     // 该导航下所有的可选项
     children: [
       {
diff --git a/src/tree-select/index.tsx b/src/tree-select/index.tsx
@@ -13,6 +13,7 @@ export type TreeSelectItem = {
   dot?: boolean;
   info?: string | number;
   disabled?: boolean;
+  className?: any;
   children: TreeSelectChildren[];
 };
 
@@ -62,7 +63,7 @@ function TreeSelect(
       info={item.info}
       title={item.text}
       disabled={item.disabled}
-      class={bem('nav-item')}
+      class={[bem('nav-item'), item.className]}
     />
   ));
 
diff --git a/src/tree-select/test/index.spec.js b/src/tree-select/test/index.spec.js
@@ -262,7 +262,6 @@ test('max prop', () => {
     data() {
       return {
         activeId: [],
-        mainActiveIndex: 0,
         items: [
           {
             text: 'group1',
@@ -278,3 +277,21 @@ test('max prop', () => {
   items.at(1).trigger('click');
   expect(wrapper.vm.activeId).toEqual([mockItem.id]);
 });
+
+test('className of nav', () => {
+  const wrapper = mount(TreeSelect, {
+    propsData: {
+      mainActiveIndex: 0,
+      items: [
+        {
+          text: 'group1',
+          className: 'my-class',
+          children: []
+        }
+      ]
+    }
+  });
+
+  const items = wrapper.findAll('.van-tree-select__nav-item');
+  expect(items.at(0).element.classList.contains('my-class')).toBeTruthy();
+});

Original file line number	Diff line number	Diff line change
@@ -145,6 +145,8 @@ In every tree object, `text` property defines `id` stands for the unique key whi
`145`	`145`	`info: 3,`
`146`	`146`	`// Whether to show red dot`
`147`	`147`	`dot: true,`
	`148`	`+ // ClassName of parent node`
	`149`	`+ className: 'my-class',`
`148`	`150`	`// leaves of this parent node`
`149`	`151`	`children: [`
`150`	`152`	`{`
Original file line number	Diff line number	Diff line change
`@@ -151,6 +151,8 @@ export default {`
`151`	`151`	`info: 3,`
`152`	`152`	`// 是否在导航名称右上角显示小红点`
`153`	`153`	`dot: true,`
	`154`	`+ // 导航节点额外类名`
	`155`	`+ className: 'my-class',`
`154`	`156`	`// 该导航下所有的可选项`
`155`	`157`	`children: [`
`156`	`158`	`{`