Accès à $ route.params dans VueJS
En parcourant cette documentation: https://router.vuejs.org/en/essentials/navigation.html
Il semble que vous puissiez lier le <router-link :to="variableName">Link Text</routerlink> Ce qui est assez chouette; cependant, j'ai eu du mal à accéder aux paramètres de route à l'intérieur d'un composant que j'essaye de construire.
J'utilise donc ceci:
<router-link :to="permalink">Title of thing</router-link>
Pour ensuite diriger la vue du routeur pour tirer le fil du forum. Utilisation de ceci dans le routeur:
import ForumThread from './views/barracks/forumThreadSingle';
// Other routes...
let routes = [
{
path: '/barracks/th/:id',
component: ForumThread,
}
];
Je peux voir dans le composant forumthread que $ route.params.id est également passé; cependant, quand j'essaye d'y accéder comme ceci:
console.log('The id is: ' + $route.params.id);
Il est incapable de trouver la partie params de l'objet.
VueJS est assez nouveau pour moi ainsi que JavaScript lui-même. Tous les exemples que j'ai vus montrent que les modèles sont en ligne avec le fichier du routeur, ce que j'essaie d'empêcher pour aider à garder mon code lisible et propre.
Quels ajustements puis-je faire pour pouvoir transmettre des propriétés au fichier modèle?
Merci!
Si vous utilisez la configuration du chargeur Vue (qui a <template></template> tags dans les fichiers), vous devez utiliser this pour référencer le routeur $, si vous le faites dans le <script></script> partie du fichier.
console.log('The id is: ' + this.$route.params.id);