How do I link properly to another page with vue 2 ? I have a bootstrap table and every row has to link somewhere else how could I do this? If I do it like this:
JavaScript
x
6
1
<tr @click="url(forum)">data</tr>
2
3
url(forum) {
4
window.location.href = '/berichten/' + forum.slug;
5
}
6
I can’t add another @click
in that row like this:
JavaScript
1
2
1
<td @click="destroy(forum)">forum</td>
2
NOTE: I do not use Vue.js router.
Any help would be much appreciated
–EDIT–
When I click on the <td @click="destroy(forum)">
it goes to the url(forum);
function instead of my destroy(forum)
function.
Advertisement
Answer
Prevent event propagation on your nested click handler by using the “.stop” modifier:
JavaScript
1
2
1
<td @click.stop="destroy(forum)">forum</td>
2
Demo (non-Vue.js):