Vue даги data объекти

Компонентнинг асосини биз бошқурадиган маълумотлар ташкил этади. Ушбу маълумотлар махсус 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 тегида чиқаринг.