Objekt data v Vue

Osnova komponente so podatki, s katerimi bomo manipulirali. Ti podatki so shranjeni v posebnem objektu data. Ta objekt mora biti vrnjen kot rezultat posebne metode:

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

Hranimo v lastnosti objekta s podatki kakšno besedilo:

App.vuedata() {
  return {
    text1: '111',
    text2: '222',
  }
}

Shranjene podatke lahko prikažemo v predstavitvi. To naredimo v dvojnih zavitih oklepajih, kjer napišemo ime lastnosti, katere vrednost želimo prikazati. Prikažimo vrednosti naših lastnosti:

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

In sedaj naredimo tako, da se vsako naše sporočilo prikaže v svojem odstavku:

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

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