From 1c94256c19405937e8a69bb36ef23724991af349 Mon Sep 17 00:00:00 2001
From: LIUCHAO <50739490+Tsong-LC@users.noreply.github.com>
Date: Wed, 14 Sep 2022 11:23:46 +0800
Subject: [PATCH] refactor(utils): refactor `flattedChildren` (#9748)

---
 .../components/descriptions/src/description.vue  | 14 +-------------
 packages/components/menu/src/menu.ts             | 16 ++--------------
 packages/utils/vue/vnode.ts                      | 13 +++++++++++++
 3 files changed, 16 insertions(+), 27 deletions(-)

diff --git a/packages/components/descriptions/src/description.vue b/packages/components/descriptions/src/description.vue
index 130fd77c0a..a4b1b5ede2 100644
--- a/packages/components/descriptions/src/description.vue
+++ b/packages/components/descriptions/src/description.vue
@@ -27,6 +27,7 @@
 <script lang="ts" setup>
 // @ts-nocheck
 import { computed, provide, useSlots } from 'vue'
+import { flattedChildren } from '@element-plus/utils'
 import { useNamespace, useSize } from '@element-plus/hooks'
 import ElDescriptionsRow from './descriptions-row.vue'
 import { descriptionsKey } from './token'
@@ -48,19 +49,6 @@ provide(descriptionsKey, props)
 
 const descriptionKls = computed(() => [ns.b(), ns.m(descriptionsSize.value)])
 
-const flattedChildren = (children) => {
-  const temp = Array.isArray(children) ? children : [children]
-  const res = []
-  temp.forEach((child) => {
-    if (Array.isArray(child.children)) {
-      res.push(...flattedChildren(child.children))
-    } else {
-      res.push(child)
-    }
-  })
-  return res
-}
-
 const filledNode = (node, span, count, isLast = false) => {
   if (!node.props) {
     node.props = {}
diff --git a/packages/components/menu/src/menu.ts b/packages/components/menu/src/menu.ts
index 2054c1aa25..ac6ffe9e3b 100644
--- a/packages/components/menu/src/menu.ts
+++ b/packages/components/menu/src/menu.ts
@@ -17,6 +17,7 @@ import { More } from '@element-plus/icons-vue'
 import {
   buildProps,
   definePropType,
+  flattedChildren,
   isObject,
   isString,
   mutable,
@@ -29,7 +30,7 @@ import { useMenuCssVar } from './use-menu-css-var'
 
 import type { MenuItemClicked, MenuProvider, SubMenuProvider } from './types'
 import type { NavigationFailure, Router } from 'vue-router'
-import type { ExtractPropTypes, VNode, VNodeNormalizedChildren } from 'vue'
+import type { ExtractPropTypes, VNode } from 'vue'
 import type { UseResizeObserverReturn } from '@vueuse/core'
 
 export const menuProps = buildProps({
@@ -356,19 +357,6 @@ export default defineComponent({
       })
     }
 
-    const flattedChildren = (children: VNodeNormalizedChildren) => {
-      const vnodes = Array.isArray(children) ? children : [children]
-      const result: any[] = []
-      vnodes.forEach((child: any) => {
-        if (Array.isArray(child.children)) {
-          result.push(...flattedChildren(child.children))
-        } else {
-          result.push(child)
-        }
-      })
-      return result
-    }
-
     return () => {
       let slot = slots.default?.() ?? []
       const vShowMore: VNode[] = []
diff --git a/packages/utils/vue/vnode.ts b/packages/utils/vue/vnode.ts
index f67f754501..9c5f461814 100644
--- a/packages/utils/vue/vnode.ts
+++ b/packages/utils/vue/vnode.ts
@@ -137,3 +137,16 @@ export const ensureOnlyChild = (children: VNodeArrayChildren | undefined) => {
   }
   return children[0]
 }
+
+export const flattedChildren = (children: VNodeNormalizedChildren) => {
+  const vNodes = isArray(children) ? children : [children]
+  const result: any[] = []
+  vNodes.forEach((child: any) => {
+    if (isArray(child.children)) {
+      result.push(...flattedChildren(child.children))
+    } else {
+      result.push(child)
+    }
+  })
+  return result
+}