Ho can I add router-link to kendo-menu-item?

[Dmitry]

There is a an example of menu, but how can I add router-link to menu item?

 

<kendo-menu-item text="Baseball">
<kendo-menu-item text="Top News"></kendo-menu-item>
<kendo-menu-item text="Radio Records"></kendo-menu-item>
</kendo-menu-item>

 

Thank you in advance

[Plamen]

Hi Dmitry,

Here is an example with Kendo Menu Vue Wrapper and router-link. The only specific thing is that it should have a specific class applied because it may be lost after click.

Regards,
Plamen
Progress Telerik

[Dmitry]

Thank you, Plamen.

I know that way, but I'm more interesting to make it with <kendo-menu-item> tag, as I need drop down menu.

[Plamen]

Hello,

I have updated the example so that it contains subItems - https://codesandbox.io/s/0174ln8rvl. Here is the markup that I used:

<kendo-menu>
  <li>
    <router-link class="k-link k-menu-link" to="/demo-1"
      >DemoOne</router-link
    >
    <ul>
      <li>
        <router-link class="k-link k-menu-link" to="/demo-1"
          >DemoOne</router-link
        >
      </li>
      <li>
        <router-link class="k-link k-menu-link" to="/demo-2"
          >DemoTwo</router-link
        >
      </li>
    </ul>
  </li>
  <li>
    <router-link class="k-link k-menu-link" to="/demo-2"
      >DemoTwo</router-link
    >
    <ul>
      <li>
        <router-link class="k-link k-menu-link" to="/demo-1"
          >DemoOne</router-link
        >
      </li>
      <li>
        <router-link class="k-link k-menu-link" to="/demo-2"
          >DemoTwo</router-link
        >
      </li>
    </ul>
  </li>
</kendo-menu>
<router-view></router-view>

Regards,
Plamen
Progress Telerik