Sometimes, we want to enclose a router-link tag in a button in Vue Router and Vue.js.

In this article, we’ll look at how to enclose a router-link tag in a button in Vue Router and Vue.js.

How to enclose a router-link tag in a button in Vue Router and Vue.js?

To enclose a router-link tag in a button in Vue Router and Vue.js, we can set the tag prop of the router-link component.

For instance, we write

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

to set the tag prop to button to render the router-link as a button.

Conclusion

To enclose a router-link tag in a button in Vue Router and Vue.js, we can set the tag prop of the router-link component.