switch - vuetify router link button




Enclosing a router-link tag in a button in vuejs (3)

@choasia's answer is correct.

Alternatively, you could wrap a button tag in a router-link tag like so:

<router-link :to="{name: 'myRoute'}">
  <button id="myButton" class="foo bar">Go!</button>
</router-link>

This is not so clean because your button will be inside a link element (<a>). However, the advantage is that you have a full control on your button, which may be necessary if you work with a front-end framework like Bootstrap.

I have never used this technique on buttons, to be honest. But I did this on divs quite often...

Can I wrap or enclose a router-link tag in a button tag?

When I press the button, I want it to route me to the desired page.


I'm working on Vue CLI 2 and this one has worked for me!

<router-link to="/about-creator">
<button>About Creator</button>
</router-link>

You can use tag prop.

<router-link to="/foo" tag="button">foo</router-link>




vue-router