⚠️ This lesson is retired and might contain outdated information.

Add Metadata to Vue Routes

Laurie Barth
InstructorLaurie Barth
Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 9 months ago

We can use the meta keyword to add and access information that's stored in our route records and passed to our components.

Instructor: [0:00] We're going to add more information for our route records to carry. We'll use the meta keyword and set a new object which will include requiresAuth is false. We can take this same information and add it to another route. In this case, we'll add it to Egghead, but we'll set requiresAuth to true.

[0:28] If we navigate to our home component, we'll see that we can access this information in the component itself. This will be similar to the way that we access params. In the template, we'll use this .route.meta.requiresAuth. If we refresh our page and navigate to home, we'll see that it shows up on our Vue.

[1:02] Alternatively, we can access this through JavaScript. As before, with our params, we'll create a function that will return the same information that we put in our template. Now, we'll access that information using the function name, and that's it.