vue.js this.$route.params 始终为空答案

【问题标题】：vue.js this.$route.params is always emptyvue.js this.$route.params 始终为空
【发布时间】：2018-01-25 13:58:04
【问题描述】：

这是我的 router.js

export default new VueRouter({
    mode: 'history',

    routes: [
        {path: '/:mid', component: load('views/main'), meta: {name: 'Main'}},
        {path: '/:mid/auth/:uid', component: load('views/auth'), meta: {name: 'Login'}},
        {path: '/:mid/success', component: load('views/success'), meta: {name: 'LoginSuccess'}},
        ....
    ]
})

这是 main.js

Quasar.start(() => {
    new Vue({
        el: '#q-app',
        created() {
            console.log(this.$route.params)
        },
        router,
        store,
        render: h => h(require('./App'))
    })
})

当我访问 localhost:8080/abc/auth/123 时，控制台显示的是 {} 而不是 {mid:'abc', uid:123} 。

有什么想法吗？

======更新======

console.log(this) 显示：

Vue$2 {_uid: 3, _isVue: true, $options: {…}, _renderProxy: Proxy, _self: Vue$2, …}
$children:[VueComponent]
$createElement:ƒ (a, b, c, d)
$el:div#q-app
...(too many lines)

console.log(this.$route) 显示：

{name: null, meta: {…}, path: "/", hash: "", query: {…}, …}
fullPath:"/"
hash:""
matched:[]
meta:{}
name:null
params:{}
path:"/"
query:{}
__proto__:Object

【问题讨论】：

当您打开该 URL 时是否显示登录视图？
是的，它确实显示了正确的内容，但是当我在控制台中登录时 route.params 始终为空。
你能分享console.log(this)和console.log(this.$route)的日志吗？
刚刚添加到问题中
有趣的是，无论我尝试什么 URL，this.$route.path 总是显示“/”，即使我在 URL 末尾添加了“?test=1”，查询也是空的.

标签： vue.js vue-router

【解决方案1】：

尝试使用功能模式将参数传递给您的路线。 https://router.vuejs.org/en/essentials/passing-props.html

【讨论】：

其实我会在 created() 函数中访问 mid 和 uid 来初始化一些组件，而不是像文档显示的那样在模板中使用它们。你能给我看一个示例代码来访问函数中的值吗？