Data doorgeven aan een component in JavaScript
Vanuit een parent component kunnen data worden doorgegeven aan een child component. Hiervoor moeten attributen met data in de component tag worden geschreven. Laten we bijvoorbeeld de voornaam en achternaam van een gebruiker doorgeven:
<template>
<User name="john" surn="smit" />
</template>
Zulke doorgegeven data worden
props genoemd. Om ervoor te zorgen dat
een component deze data ontvangt,
moeten hun namen worden opgesomd
in de props configuratie:
<script>
export default {
props: ['name', 'surn'],
data() {
return {
}
}
}
</script>
Nu kunnen de doorgegeven data worden weergegeven in de template van het child component:
<template>
{{ name }}
{{ surn }}
</template>
Geef aan het component Employee
de voornaam, achternaam en leeftijd van de werknemer door.
Gebruik binnen het component Employee
elke van zijn props
in een aparte tag.
