From f6a835721cb1f5720f561c76f246268d71c27518 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Sat, 18 Dec 2021 11:56:13 +0800
Subject: [PATCH] fix(Tabs): should not render line when have no tab (#10063)

---
 .../test/__snapshots__/index.spec.tsx.snap    | 30 ++++++-------------
 .../test/__snapshots__/insert.spec.tsx.snap   |  2 --
 packages/vant/src/tab/test/index.spec.tsx     |  2 +-
 packages/vant/src/tabs/Tabs.tsx               | 10 +++++--
 4 files changed, 17 insertions(+), 27 deletions(-)

diff --git a/packages/vant/src/tab/test/__snapshots__/index.spec.tsx.snap b/packages/vant/src/tab/test/__snapshots__/index.spec.tsx.snap
index 6a0859c70..622d3363d 100644
--- a/packages/vant/src/tab/test/__snapshots__/index.spec.tsx.snap
+++ b/packages/vant/src/tab/test/__snapshots__/index.spec.tsx.snap
@@ -121,27 +121,15 @@ exports[`should allow to set name prop 1`] = `
 `;
 
 exports[`should emit rendered event after tab is rendered 1`] = `
-DOMWrapper {
-  "isDisabled": [Function],
-  "style": CSSStyleDeclaration {
-    "_importants": Object {},
-    "_length": 0,
-    "_onChange": [Function],
-    "_values": Object {},
-  },
-  "wrapperElement": <div
-    aria-labelledby="van-tabs-0"
-    class="van-tab__panel"
-    id="van-tab"
-    role="tabpanel"
-    style=""
-    tabindex="0"
-  >
-    
-    Text
-    
-  </div>,
-}
+<div id="van-tab"
+     role="tabpanel"
+     class="van-tab__panel"
+     tabindex="0"
+     aria-labelledby="van-tabs-0"
+     style
+>
+  Text
+</div>
 `;
 
 exports[`should not render empty tab 1`] = `
diff --git a/packages/vant/src/tab/test/__snapshots__/insert.spec.tsx.snap b/packages/vant/src/tab/test/__snapshots__/insert.spec.tsx.snap
index f6deae21c..010ea8025 100644
--- a/packages/vant/src/tab/test/__snapshots__/insert.spec.tsx.snap
+++ b/packages/vant/src/tab/test/__snapshots__/insert.spec.tsx.snap
@@ -219,8 +219,6 @@ exports[`should render nav-bottom slot correctly 1`] = `
          class="van-tabs__nav van-tabs__nav--line"
          aria-orientation="horizontal"
     >
-      <div class="van-tabs__line">
-      </div>
     </div>
   </div>
   Nav Bottom
diff --git a/packages/vant/src/tab/test/index.spec.tsx b/packages/vant/src/tab/test/index.spec.tsx
index 6dc31c618..93c689a25 100644
--- a/packages/vant/src/tab/test/index.spec.tsx
+++ b/packages/vant/src/tab/test/index.spec.tsx
@@ -256,7 +256,7 @@ test('should emit rendered event after tab is rendered', async () => {
 
   await later();
   expect(onRendered).toHaveBeenCalledWith('a', 'title1');
-  expect(wrapper.find('.van-tab__panel')).toMatchSnapshot();
+  expect(wrapper.find('.van-tab__panel').html()).toMatchSnapshot();
 
   const tabs = wrapper.findAll('.van-tab');
   await tabs[1].trigger('click');
diff --git a/packages/vant/src/tabs/Tabs.tsx b/packages/vant/src/tabs/Tabs.tsx
index b56d0e1f1..4d53ec615 100644
--- a/packages/vant/src/tabs/Tabs.tsx
+++ b/packages/vant/src/tabs/Tabs.tsx
@@ -384,6 +384,12 @@ export default defineComponent({
         />
       ));
 
+    const renderLine = () => {
+      if (props.type === 'line' && children.length) {
+        return <div class={bem('line')} style={state.lineStyle} />;
+      }
+    };
+
     const renderHeader = () => {
       const { type, border } = props;
       return (
@@ -403,9 +409,7 @@ export default defineComponent({
           >
             {slots['nav-left']?.()}
             {renderNav()}
-            {type === 'line' && (
-              <div class={bem('line')} style={state.lineStyle} />
-            )}
+            {renderLine()}
             {slots['nav-right']?.()}
           </div>
         </div>