Objekt data vo Vue
Základom komponentu sú dáta,
s ktorými budeme manipulovať.
Tieto dáta sú uložené v špeciálnom
objekte data. Tento objekt
by mal byť vrátený ako výsledok
špeciálnej metódy:
export default {
data() {
return {
}
}
}
Ukladajme vo vlastnosti objektu s dátami nejaký text:
data() {
return {
text1: '111',
text2: '222',
}
}
Uložené dáta je možné zobraziť v prezentácii. To sa robí v dvojitých zložených zátvorkách, do ktorých sa píše názov vlastnosti, ktorej hodnotu chceme zobraziť. Zobrazme hodnoty našich vlastností:
<template>
{{ text1 }}
{{ text2 }}
</template>
A teraz urobme tak, aby každá z našich správ sa zobrazila vo svojom odseku:
<template>
<p>{{ text1 }}</p>
<p>{{ text2 }}</p>
</template>
Nech v data je uložené meno
a priezvisko používateľa:
data() {
return {
name: 'john',
surn: 'smit',
}
}
Zobrazte každú vlastnosť v
samostatnom tagu div.
