Objekt data ve Vue
Základem komponentu jsou data,
s kterými budeme manipulovat.
Tato data jsou uložena ve speciálním
objektu data. Tento objekt
by měl být vrácen jako výsledek
speciální metody:
export default {
data() {
return {
}
}
}
Ukládejme ve vlastnosti objektu s daty nějaký text:
data() {
return {
text1: '111',
text2: '222',
}
}
Uložená data lze zobrazit v šabloně. To se dělá v dvojitých složených závorkách, do kterých se píše jméno vlastnosti, jejíž hodnotu chceme zobrazit. Zobrazme hodnoty našich vlastností:
<template>
{{ text1 }}
{{ text2 }}
</template>
A nyní udělejme to, aby se každá z našich zpráv zobrazila ve svém odstavci:
<template>
<p>{{ text1 }}</p>
<p>{{ text2 }}</p>
</template>
Nechť v data je uloženo jméno
a příjmení uživatele:
data() {
return {
name: 'john',
surn: 'smit',
}
}
Vypište každou vlastnost v
samostatném tagu div.
