如何在Vue中获取路线的当前名称? [英] How to get current name of route in Vue?

问题描述

我想获取 vue-router 当前路由的名称，我有一个组件菜单，可以导航到另一个组件，所以我想显示当前路由的名称.我有这个:

created(){this.currentRoute;//this.nombreRuta = this.$route.name;},计算:{当前路线:{得到(){this.nombreRuta = this.$route.name;}}}

但是路由名称的标签没有变化，标签只显示第一个加载的路由的名称.谢谢

显示我想要的图像

解决方案

您正在错误地使用 computed.您应该在函数中返回该属性.有关详细信息，请参阅文档.

这是您改编的示例:

计算:{当前路由名称(){返回 this.$route.name;}}

然后你可以像这样使用它:

{{ currentRouteName }}

你也可以不使用计算属性直接在模板中使用它，像这样:

{{ $route.name }}

I want to get the name of the current route of vue-router, i have a component menu with navigation to another componentes, so i want to dispaly the name of the current route. I have this:

created(){
    this.currentRoute;
    //this.nombreRuta = this.$route.name;
},
computed:{
    currentRoute:{
        get(){
            this.nombreRuta = this.$route.name;
        }
    }
}

But the label of the name of the route does not change, the label only show the name of the first loaded route. Thank You

EDIT:

Image to show what i want

解决方案

You are using computed incorrectly. You should return the property in the function. See the docs for more information.

Here is your adapted example:

computed: {
    currentRouteName() {
        return this.$route.name;
    }
}

You can then use it like this:

<div>{{ currentRouteName }}</div>

You can also use it directly in the template without using a computed property, like this:

<div>{{ $route.name }}</div>

这篇关于如何在Vue中获取路线的当前名称?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！