React语义UI如何使用“链接”

时间:2018-09-17 20:29:29

标签: javascript reactjs react-router semantic-ui semantic-ui-react

我是语义UI的新手。我尝试用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".....>

我该如何解决问题?谢谢。

1 个答案:

答案 0 :(得分:1)

您可以将其传递给as={Link}

因此,基本上您的对象应该反映出以下内容:

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