From 4ab1ebb4c02b6b55edfd2cfdece578c95668c3fd Mon Sep 17 00:00:00 2001
From: saller <weskerli@163.com>
Date: Tue, 15 Nov 2022 10:22:19 +0800
Subject: [PATCH] fix(comp:transfer): empty suffix node shouldn't be rendered
 (#1267)

---
 packages/cdk/utils/src/vNode.ts                     | 13 +++++++------
 packages/components/transfer/src/content/Header.tsx | 12 +++++++-----
 2 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/packages/cdk/utils/src/vNode.ts b/packages/cdk/utils/src/vNode.ts
index d302504da..425459ef2 100644
--- a/packages/cdk/utils/src/vNode.ts
+++ b/packages/cdk/utils/src/vNode.ts
@@ -50,12 +50,13 @@ export function hasSlot(slots: Slots, key = 'default'): boolean {
   return !isNil(slots[key])
 }
 
-export function isEmptyNode(node: VNodeChild): boolean {
-  return (
-    !node ||
-    isComment(node) ||
-    (isFragment(node) && (node as any).children.length === 0) ||
-    (isText(node) && (node as any).children.trim() === '')
+export function isEmptyNode(nodes: VNodeChild): boolean {
+  return convertArray(nodes).every(
+    node =>
+      !node ||
+      isComment(node) ||
+      (isFragment(node) && (node as any).children.length === 0) ||
+      (isText(node) && (node as any).children.trim() === ''),
   )
 }
 
diff --git a/packages/components/transfer/src/content/Header.tsx b/packages/components/transfer/src/content/Header.tsx
index 5b7410b61..54c642839 100644
--- a/packages/components/transfer/src/content/Header.tsx
+++ b/packages/components/transfer/src/content/Header.tsx
@@ -7,9 +7,7 @@
 
 import { type VNodeTypes, defineComponent, inject, normalizeClass, onMounted, ref, watch, withKeys } from 'vue'
 
-import { isArray } from 'lodash-es'
-
-import { useState } from '@idux/cdk/utils'
+import { isEmptyNode, useState } from '@idux/cdk/utils'
 import { ɵInput, type ɵInputInstance } from '@idux/components/_private/input'
 import { IxCheckbox } from '@idux/components/checkbox'
 import { IxIcon } from '@idux/components/icon'
@@ -142,7 +140,11 @@ export default defineComponent({
     const renderSuffix = (prefixCls: string) => {
       const suffix = slots.headerSuffix?.({ isSource: props.isSource })
 
-      return suffix && <span class={`${prefixCls}-suffix`}>{suffix}</span>
+      if (isEmptyNode(suffix)) {
+        return
+      }
+
+      return <span class={`${prefixCls}-suffix`}>{suffix}</span>
     }
 
     const renderHeader = (prefixCls: string) => {
@@ -166,7 +168,7 @@ export default defineComponent({
 
       const children = renderHeader(prefixCls)
 
-      if (!children || (isArray(children) && children.length <= 0)) {
+      if (isEmptyNode(children)) {
         return
       }