A data objektum Vue-ban

A komponens alapja az az adat, amelyen manipulálunk. Ezek az adatok egy speciális data objektumban tárolódnak. Ennek az objektumnak egy speciális metódus eredményeként kell visszatérnie:

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

Tároljunk az adatobjektum egyik tulajdonságában valamilyen szöveget:

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

A tárolt adatokat meg lehet jeleníteni a nézetben. Ezt dupla kapcsos zárójelek között kell megtenni, ahol meg kell adni annak a tulajdonságnak a nevét, amelynek az értékét ki szeretnénk jeleníteni. Jelenítsük meg a tulajdonságaink értékeit:

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

Most tegyük úgy, hogy minden üzenetünk a saját bekezdésében jelenjen meg:

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

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