...

/

Props and Emitting Events

Props and Emitting Events

Explore passing data between components using props and custom events.

We'll cover the following...

One of the issues we have to deal with when breaking up our code into multiple pages and components is how we share data (state) between them. Continuing on from the last example, we have a structure like this:

Press + to interact
Post components as children of the blog page
Post components as children of the blog page

Our blog.vue page contains the blog post data, and we need to use it inside of the Post component, which we repeat three times.

Props

This is where props come in. Props are a way to pass data from a parent to a child component and are added to the component as an attribute. In this example, since Post.vue is nested inside of blog.vue, it is the child component and will receive the ...