Skip to content

Commit a8c72fc

Browse files
authored
fix[Menu]: fix menu-item-group not rendering in SSR (#7349)
* docs: updating the `dropdownRender` description and jumps in the FAQ for Select * fix: `menu-item-group` rendered in ssr
1 parent c25736d commit a8c72fc

File tree

1 file changed

+8
-5
lines changed

1 file changed

+8
-5
lines changed

components/menu/src/Menu.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -439,15 +439,17 @@ export default defineComponent({
439439
forceSubMenuRender: computed(() => props.forceSubMenuRender),
440440
rootClassName: hashId,
441441
});
442+
443+
const getChildrenList = () => itemsNodes.value || flattenChildren(slots.default?.());
442444
return () => {
443-
const childList = itemsNodes.value || flattenChildren(slots.default?.());
445+
const childList = getChildrenList();
444446
const allVisible =
445447
lastVisibleIndex.value >= childList.length - 1 ||
446448
mergedMode.value !== 'horizontal' ||
447449
props.disabledOverflow;
448450
// >>>>> Children
449-
const wrappedChildList =
450-
mergedMode.value !== 'horizontal' || props.disabledOverflow
451+
const getWrapperList = childList => {
452+
return mergedMode.value !== 'horizontal' || props.disabledOverflow
451453
? childList
452454
: // Need wrap for overflow dropdown that do not response for open
453455
childList.map((child, index) => (
@@ -458,6 +460,7 @@ export default defineComponent({
458460
v-slots={{ default: () => child }}
459461
></MenuContextProvider>
460462
));
463+
};
461464
const overflowedIndicator = slots.overflowedIndicator?.() || <EllipsisOutlined />;
462465

463466
return wrapSSR(
@@ -470,7 +473,7 @@ export default defineComponent({
470473
class={[className.value, attrs.class, hashId.value]}
471474
role="menu"
472475
id={props.id}
473-
data={wrappedChildList}
476+
data={getWrapperList(childList)}
474477
renderRawItem={node => node}
475478
renderRawRest={omitItems => {
476479
// We use origin list since wrapped list use context to prevent open
@@ -514,7 +517,7 @@ export default defineComponent({
514517
>
515518
<Teleport to="body">
516519
<div style={{ display: 'none' }} aria-hidden>
517-
<PathContext>{wrappedChildList}</PathContext>
520+
<PathContext>{getWrapperList(getChildrenList())}</PathContext>
518521
</div>
519522
</Teleport>
520523
</Overflow>,

0 commit comments

Comments
 (0)