Data обект във Vue

Основата на компонента са данните, с които ще манипулираме. Тези данни се съхраняват в специален обект data. Този обект трябва да се връща като резултат от специален метод:

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

Нека съхраняваме в свойство на обекта с данни някакъв текст:

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

Съхраняваните данни могат да се извеждат в представянето. Това се прави в двойни фигурни скоби, в които се пише името на свойството, чиято стойност искаме да изведем. Нека изведем стойностите на нашите свойства:

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

А сега нека направим така, че всяко от нашите съобщения да се изведе в свой абзац:

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

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