Ant设计仅添加文本菜单项

Question

我想在我的Ant设计菜单中添加一个简单的文本项,例如:

<Menu>
  <Menu.Item key={to} style={style}><a href="/page1"> Page 1</a></Menu.Item>
  <Menu.Item key={to} style={style}><a href="/page2"> Page 2</a></Menu.Item>
  <span>Non clickable text</span>
</Menu>

这显示正常但它在控制台中给了我很多错误:

index.js:2178警告:React无法识别subMenuKeyDOM元素上的prop.如果您有意希望它作为自定义属性显示在DOM中,请将其拼写为小写submenukey.如果您不小心从父组件传递了它,请将其从DOM元素中删除.

有没有人有办法解决这个问题？我真的很喜欢这个Menu组件,所以不要重写我自己的.

Answer 1

如图所示这里，问题是，你想包括<Divider />在你的菜单，菜单有孩子会接受一个有限的名单。<Divider />不是可以接受的孩子之一。

如果您删除该<Divider />元素，这些警告将消失。我自己实际上遇到了这个。

将您的引用更改为

<Menu.Divider />

你将成为古奇。

Answer 2

菜单标记仅接受Menu.Item,SubMenu和Menu.ItemGroup作为子项.Menu.Item仅接受disabled和key作为属性.除此之外,如果您使用自定义html标记,您将在控制台中遇到这些错误.而且,根据ant docs,我们需要在菜单级别而不是menu.item中使用样式标记

我的建议是删除锚标记以消除仅重定向文本部分,或者您可以使用disabled = {true}以禁用方式显示文本.

<Menu.Item key="3"  disabled={true}>Non clickable text </Menu.Item>

Answer 3

尝试空ItemGroup：

<Menu.ItemGroup title="Non clickable text" />