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:

App.vueexport default {
  data() {
    return {
      
    }
  }
}

Saugokime objekto su duomenimis savybėje kokį nors tekstą:

App.vuedata() {
  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:

App.vue<template>
  {{ text1 }}
  {{ text2 }}
</template>

O dabar padarykime taip, kad kiekvienas iš mūsų pranešimų būtų atvaizduotas savame paragrafe:

App.vue<template>
  <p>{{ text1 }}</p>
  <p>{{ text2 }}</p>
</template>

javascriptdata() {
  return {
    name: 'john',
    surn: 'smit',
  }
}