web-dev-qa-db-fra.com

Comment passer une variable à vue-router v-link

J'ai un composant vue pour rendre la liste de navigation et passer la liste de navigation, chaque élément comprend le titre et le lien:

<template>
  <ul>
    <li v-for="item in list"><a v-link="{{ path: item.link }}"></a></li>
  </ul>
</template>

<script>
  export default {
    props: ['list']
  }
</script>

J'essaye de passer la variable item.link vers le chemin du lien virtuel, mais a échoué.

obtenez cet avertissement:

[Vue warn]: v-link="{{ path: item.link }}": attribute interpolation is not allowed in Vue.js directives and special attributes.

que dois-je faire si je passe une variable au chemin v-link?

merci d'avoir lu :)

vue.jsvue-router
8
luotao

l'instruction dans v-link n'a pas besoin de la syntaxe "Moustache".

<li v-for="item in list"><a v-link="{ path: item.link }"></a></li>

vous pouvez voir http://router.vuejs.org/en/index.html

8
jilon

J'ai utilisé ce qui suit avec vue-router 2.x :

<router-link :to="{path: '/applications/' + currentApplicationId}" class="nav-link">Overview</router-link>

Plus de documentation peut être trouvée ici .

10
czerasz

Le chemin le plus court serait:

<router-link :to="`/applications/${currentApplicationId}`">Overview</router-link>
3
Kelvin Barsana