Question

浏览此文档： https://router.vuejs.org/en/essentials/navigation.html

看起来你可以绑定<router-link :to="variableName">Link Text</routerlink>这很漂亮;但是，我试图在我正在尝试构建的组件中访问路由参数时遇到了一些麻烦。

所以我用这个：

<router-link :to="permalink">Title of thing</router-link>

然后指示路由器视图拉取论坛帖子。在路由器中使用它：

import ForumThread from './views/barracks/forumThreadSingle';

// Other routes...
let routes = [
    {
        path: '/barracks/th/:id',
        component: ForumThread,
    } 
];

我可以在forumthread组件中看到$ route.params.id也被传递了;但是，当我尝试这样访问它时：

console.log('The id is: ' + $route.params.id);

无法找到对象的参数部分。

VueJS对我和JavaScript本身来说都是一个新手。我看到的所有示例都显示模板与路由器文件内联，这是我试图阻止的，以帮助保持我的代码可读和清洁。

我可以进行哪些调整以便将属性传递给模板文件？

谢谢！

Answer 1

如果你正在使用Vue Loader设置（文件中有<template></template>个标签），你需要使用this来引用$ router，如果你正在做的话所以在文件的<script></script>部分内。

 console.log('The id is: ' + this.$route.params.id);

访问VueJS中的$ route.params

1 个答案: