Data objektas Vue
Komponento pagrindas yra duomenys,
kuriais mes manipuliuosime.
Šie duomenys saugomi specialiame
objekte data. Šis objektas
turi būti grąžinamas kaip specialaus
metodo rezultatas:
export default {
data() {
return {
}
}
}
Saugokime objekto su duomenimis savybėje kokį nors tekstą:
data() {
return {
text1: '111',
text2: '222',
}
}
Saugomi duomenys gali būti atvaizduojami vaizde. Tai daroma dvigubose garbanotose skliausteliuose, kuriuose rašomas savybės pavadinimas, kurio reikšmę norime atvaizduoti. Atvaizduokime mūsų savybių reikšmes:
<template>
{{ text1 }}
{{ text2 }}
</template>
O dabar padarykime taip, kad kiekvienas iš mūsų pranešimų būtų atvaizduotas savame paragrafe:
<template>
<p>{{ text1 }}</p>
<p>{{ text2 }}</p>
</template>
Tegul data saugo vardą
ir vartotojo pavardę:
data() {
return {
name: 'john',
surn: 'smit',
}
}
Atvaizduokite kiekvieną savybę
atskirame div žymėjime.
