Antd Menu.Item 中的字幕或 child 元素

Question

我知道您可以 in an Antd Menu.Item，但我想知道您是否可以为菜单项创建（样式化的）child 元素或副标题。类似于：

------
**Item 1**
---
**Item 2**
This item is second
---
**Item 3**
------

我试过像下面这样添加 <div> 或 <p>，但它似乎被隐藏了。

<Menu.Item key={eventKey} {...props}
    <span>{item.title}</span>
    <div>A styled subtitle here</div>
</Menu.Item>

Answer 1

我认为您可以在 Menu.Item.

中使用纯 html 元素和 css

也许您需要尝试 height 或 lineHeight 设置并查看 inspect 视图。

这个基本示例对我有用：

<Menu.Item key="1" style={{ lineHeight: '20px' }}>
   <span>
      Option 1
   </span>
   <br />
   <span>Test</span>
</Menu.Item>

Here 是一个有效的 Stackblitz。

<h1> 等元素也有效。