Custom tag for router-link

dacoloma commented 3 years ago

This is my first post about issue on github, sorry in advance for potential mistakes and english errors (I'm french). I'm trying to use router-link with a custom tag tr. Also I'm using it in a for-loop. The render with for-loop works fine, but I'm still having the <a> instead of <tr>

My code:

<router-link tag="tr" v-for="file in files" :key="file.id" :to="{name: 'File', params: { id: file['_id'] } }" >
<td>[...]</td>
</router-link>

Render:

<a href="..." tag="tr" class="">
<td class="left aligned"></td>
</a>

Instead of:

<tr href="..." tag="tr" class="">
<td class="left aligned"></td>
</tr>

I would like this to work because I'm using router-view with transition but I can't find any solution Thanks

Kocal commented 3 years ago

The prop tag already allow you to specify a custom tag for rendering your link (https://router.vuejs.org/api/#tag).

If you are facing an issue with vue-router, please open an issue on https://github.com/vuejs/vue-router repository.

dacoloma commented 3 years ago

Well, for vue-router 4.0.0-rc.3, it is not working.

I will open the issue on the official repo then. Thanks

sqal commented 3 years ago

@dacoloma https://next.router.vuejs.org/guide/migration/#removal-of-append-prop-in-router-link

dacoloma commented 3 years ago

@sqal Thanks a lot ! I did not see that

vuejs / rfcs

Custom tag for router-link #239