Data обект във Vue

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

export default {
	data() {
		return {
			
		}
	}
}

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

data() {
	return {
		text1: '111',
		text2: '222',
	}
}

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

<template>
	{{ text1 }}
	{{ text2 }}
</template>

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

<template>
	<p>{{ text1 }}</p>
	<p>{{ text2 }}</p>
</template>

Нека в data се съхранява име и фамилия на потребител:

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

Изведете всяко свойство в отделен таг div.