7
You can wrap router-link
outside of an a
tag
<router-link tag="td" :to="`/contracts/${row.id}`">
<a>
{{ row.type | initials }}
</a>
</router-link>
In this case the <a>
will be the actual link (and will get the correct href), but the active class will be applied to the outer <td>
.
1
In order to direct router activity upon certain events you can access it programmatically. It’s easy to debug and you’ll have a lot of control of inputs and outputs.
<td @click.prevent="someAction($event)">xxxx</td>
…
someAction(event) {
if (event.ctrlKey === true) {
// if click + ctrl
let routeData = this.$router.resolve({path: …});
window.open(routeData.href, '_blank');
} else {
// if just click
this.$router.push({path: …});
};
}
0
The default tag for <router-link>
is <a>
with an href
attribute, eg
<a href="/contracts/123">RowType</a>
Your browser knows what to do for a Ctrl+click, ie open the link in a new tab.
For other elements, there is no such default action so nothing happens.
- [Vuejs]-Adding a preprocessor language to the style portion of a vueify component causes build to fail without error
- [Vuejs]-Commit objects to state in vuex
Source:stackexchange.com