How to get a specific route data by route name in VueJs?

Question

In VueJs i can always access the current route data. but what if i want to access a different route's data by its name ? suppose i have routes defined,

[
    {
        name: "dashboard",
        path: "/",
        component: Dashboard,
        meta: {
            title: "Dashboard",
        }
    },
    {
        name: "login",
        path: "/login",
        component: Login,
        meta: {
            title: "Login",
        }
    }
]

now suppose i am in dashboard route. i can access its data by this.$route but what if i want to access the meta data of route named as login ? is there any function which will return me the object of route named login ?

Answer 1

You can use the resolve method to translate route name into a path like this:

const { href } = this.$router.resolve({
  name: 'password-change',
});

or if you want more information:

const { route } = this.$router.resolve({
  name: 'password-change',
});

in return you get an object containing route path, meta, params etc.