The following examples show how to pass data between components in vue js, using props and custom events.

Example 1: Props

ParentComponent ==> ChildComponent

See the Pen Vue js - Props example by Vincent Humeau (@vinceumo) on CodePen.

Example 2: Events

ParentComponent <== ChildComponent

See the Pen Vue js - Events example by Vincent Humeau (@vinceumo) on CodePen.

Example 3: Props and events

ParentComponent <==> ChildComponent

See the Pen Vue js - Props and Event example by Vincent Humeau (@vinceumo) on CodePen.