React Semantic UI How to use "Link"

Viewed 1534

I'm new to semantic-ui. I try to map Menu Items with lodash. But unfortunately I can't routing my elements.

Here is my code

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

And its my menu object

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

so I want to Link my menu with react-router. I try everythink but i cant solve the problem

It returns

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

But I want to get

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

How can i do solve the problem? Thank you.

1 Answers

You can pass it as={Link}.

So basically your objects should reflect that:

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