⊗jsvuPmCmPD 59 of 72 menu

Passing Data to a Component in JavaScript

You can pass data from a parent component to a child component. To do this, you should write attributes with data in the component tag. Let's, for example, pass the user's first and last name:

<template> <User name="john" surn="smit" /> </template>

Such passed data is called props. In order for the component to receive this data, its names must be listed in the props setting:

<script> export default { props: ['name', 'surn'], data() { return { } } } </script>

Now the passed data can be displayed in the child component's view:

<template> {{ name }} {{ surn }} </template>

Pass the employee's first name, last name, and age to the Employee component.

Inside the Employee component, output each of its props in a separate tag.

enru