Menu.Item does not support React Fragments

[xianghongai]

• I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

This question does not require ‘Reproduction link’, so this link is invalid.

Steps to reproduce

When dynamically constructing menu.item, three states,

• state '0' shows one,
• state '1' shows another,
• and state '2' displays two items.

const tableData = [
  { name: 'item 1', status: 0 },
  { name: 'item 2', status: 1 },
  { name: 'item 3', status: 2 }
]

const status = [
  { key: 0, text: "action a" },
  { key: 1, text: "action b" }
]

function MenuItem() {
  return (
    tableData.forEach((dataItem) => {
      status.some((statusItem) => {
        if (dataItem.status === statusItem.key) {
          if (statusItem.key === 0) {
            return <Menu.Item key="action a">action a</Menu.Item>;
          } else if (statusItem.key === 1) {
            return <Menu.Item key="action b">action b</Menu.Item>;
          } else {
            // This condition is currently not supported
            return <>
              <Menu.Item key="action a">action a</Menu.Item>
              <Menu.Item key="action b">action b</Menu.Item>
            </>;
          }

          return true;
        }
      });

    });
  )
}

What is expected?

Menu.Item support React 'Fragments'

What is actually happening?

Menu.Item renders the list ClassName is undefined-item, instead of the expected 'ant-menu-item'.

Environment	Info
antd	3.19.2
React	16.8.6
System	windows 10
Browser	chrome v74

---

This question does not require ‘Reproduction link’, so this link is invalid.

[abz53378]

try this

return [
  <Menu.Item key="action a">action a</Menu.Item>,
  <Menu.Item key="action b">action b</Menu.Item>
];

[xianghongai]

class name: ant-menu-item ant-menu-item