fix(dropdown): flat children as item children

Tencent · Oct 17, 2022 · b0f258b · b0f258b
1 parent d0316ec
commit b0f258b
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 7 deletions.
diff --git a/src/dropdown/_example/slot.vue b/src/dropdown/_example/slot.vue
@@ -59,7 +59,7 @@
               </t-dropdown-menu>
             </t-dropdown-item>
 
-            <t-dropdown-item :value="2"> 操作二 </t-dropdown-item>
+            <t-dropdown-item :value="2">操作二 </t-dropdown-item>
 
             <t-dropdown-item :value="3">操作三</t-dropdown-item>
           </t-dropdown-menu>
@@ -73,7 +73,7 @@ import { MessagePlugin } from 'tdesign-vue-next';
 
 const clickHandler = (data) => {
   console.log(data, 'data');
-  if (data.value !== 212) MessagePlugin.success(`选中【${data.content}】`);
+  if (data.value !== 212) MessagePlugin.success(`选中【${data.value}】`);
 };
 const handleClick = () => {
   MessagePlugin.success(`点击 操作2-1-2`);

diff --git a/src/dropdown/hooks/useDropdownOptions.ts b/src/dropdown/hooks/useDropdownOptions.ts
@@ -18,18 +18,21 @@ export const getOptionsFromChildren = (menuGroup: any): DropdownOption[] => {
       .map((item) => {
         const groupChildren = item.children?.default?.();
 
-        const contentIdx = groupChildren?.findIndex?.(
-          (v: VNode) => typeof v.children === 'string' && (v.type as { description: string }).description !== 'Comment',
+        // 当前节点的渲染内容
+        const contentCtx = groupChildren?.filter?.(
+          (v: VNode) => !['TDropdownMenu', 'TDropdownItem'].includes((v.type as { name: string })?.name),
         );
-        const childrenContent = groupChildren?.filter?.(
+        // 嵌套菜单的节点
+        const childrenCtx = groupChildren?.filter?.(
           (v: VNode) =>
             typeof v.children !== 'string' &&
             ['TDropdownMenu', 'TDropdownItem'].includes((v.type as { name: string })?.name),
         );
+
         return {
           ...item.props,
-          content: groupChildren?.[contentIdx]?.children || groupChildren,
-          children: childrenContent?.length > 0 ? getOptionsFromChildren(childrenContent) : null,
+          content: contentCtx || groupChildren,
+          children: childrenCtx?.length > 0 ? getOptionsFromChildren(childrenCtx) : null,
         };
       })
       .filter((v) => !!v.content);