Reaktiviteti në Kornizën Vue

Çdo ndryshim i të dhënave nga data çon në një ndryshim të menjëhershëm të shfaqjes së këtyre të dhënave në faqe. Ky sjellje e Vue quhet reaktivitet.

Le ta kontrollojmë në praktikë. Le të themi se kemi vetinë e mëposhtme:

data() {
	return {
		text: 'xxx',
	}
}

Le të shfaqim vlerën e kësaj vetie:

<template>
	{{ text }}
</template>

Le të bëjmë një buton, upon clicking on which vetia jonë do të ndryshojë:

<template>
	{{ text }}
	<button @click="change">text</button>
</template>

Le të shkruajmë tani metodën që do të thirret me klikimin në buton dhe do të ndryshojë vetinë:

methods: {
	change: function() {
		this.text = 'yyy';
	}
}

Nëse mbledhim të gjithë kodin së bashku dhe shtypim butonin - teksti në ekran reaktivisht do të ndryshojë në një tjetër.

Është dhënë vetia text. Shfaqni përmbajtjen e kësaj vetie në një paragraf.

Është dhënë një buton. Bëni që me klikimin në këtë buton vlera e vetisë text të ndryshojë në mënyrë reaktive në një tjetër.

Janë dhënë dy butona. Bëni që me klikimin në butonin e parë vlera e vetisë text të ndryshojë në mënyrë reaktive në një vlerë, kurse me klikimin në të dytin - në një tjetër.