代码之家 › 专栏 › 技术社区 › theJuls

包装React语义UI菜单。锚标记中的项,而不破坏其样式

semantic-ui-react semantic-ui reactjs javascript

theJuls · 技术社区 · 8 年前

我有一个React语义Ui菜单,它必须链接到另一个页面。我试图用一个锚标记来包装它,但这完全破坏了菜单按钮上的样式。在假设是但是之前,我想我是做错了。

这就是我的代码当前的样子:

<Menu tabular attached='top'>
   <a href={item1Url}><Menu.Item link>item1</Menu.Item></a>
   <a href={item2Url}><Menu.Item active link>Item 2</Menu.Item></a>
</Menu>

在包装之前 Menu.Item 与 a 标签,这是它现在的样子:

与 一 标签包装它,它看起来像这样:

更不用说当我在上面盘旋的时候它就完全消失了。我做错什么了吗?

1 回复 | 直到 8 年前

ChrisR 8 年前

如果你看看 the doc ,您可以直接添加 href (和 target )属性到 Menu.Item 元素。

在您的情况下,结果将是:

<Menu tabular attached='top'>
   <Menu.Item href="item1Url">item1</Menu.Item></a>
   <Menu.Item href="item2Url"active>Item 2</Menu.Item></a>
</Menu>

推荐文章

MachoBoy · 如何使用redux子空间重用具有相同动作的reducer

8 年前

merrilj · Reactjs-在动态元素渲染中向输入添加ref

8 年前

DuckQueen · 如何为react重新创建带有语义ui的自动折叠菜单?

8 年前

Tzvetlin Velev · 如何使用语义的React表组件从表行单击中获取数据

8 年前

DuckQueen · 如何在JavaScript中创建嵌套菜单?

8 年前

Dan · 如何设置语义UI下拉列表大小以匹配按钮等

8 年前

amir · 使用javascript更改图标标记

8 年前

rimraf · 从语义用户界面反应下拉菜单中删除插入符号

9 年前

Tyler Chong · 有没有办法通过语义用户界面获得动态图标?

9 年前

stevenlacerda · 我无法在语义使用react中关闭模式和调光器

9 年前