Enclosing a router-link tag in a button in vuejs
Solution 1:
You can use tag
prop.
<router-link to="/foo" tag="button">foo</router-link>
Solution 2:
While the answers on here are all good, none seem to be the simplest solution. After some quick research, it seems that the real easiest way to make a button use vue-router is with the router.push
call. This can be used within a .vue template like this:
<button @click="$router.push('about')">Click to Navigate</button>
Super simple and clean. I hope someone else finds this useful!
Source: https://router.vuejs.org/guide/essentials/navigation.html