React Semantic UI 如何使用“链接”

Question

我是语义用户界面的新手。我尝试用 lodash 映射菜单项。但不幸的是，我无法路由我的元素。

这是我的代码

</Menu.Item>
    {_.map(menuItems, item => <Menu.Item {...item} />)}
</Menu.Menu>

它是我的菜单对象

const menuItems= [
  { as: "a", content: "About Us", key: "about", path:"/about"},
  { as: "a", content: "Contact", key: "contact", path:"/contact"}
];

所以我想将我的菜单与 react-router 链接。我尝试了所有想法，但我无法解决问题

它返回

 <a path="/about" ........>

但我想得到

<Link path="/about".....>

我该如何解决这个问题？谢谢。

Answer 1

你可以通过as={Link}。

所以基本上你的对象应该反映：

const menuItems= [
  { as: Link, content: "About Us", key: "about", path:"/about"},
  { as: Link, content: "Contact", key: "contact", path:"/contact"}
];