Marrja e të dhënave të formës nga një ngjarje në Vue

Le të themi se kemi një buton dhe një input, në të cilin futet një numër. Le të themi, me një klikim në buton të shfaqim katrorin e numrit të futur në input. Le të fillojmë zbatimin.

Për të zgjidhur problemin do të na duhen dy veti. Veti num do të ndryshojë ndërsa futen të dhënat në input, dhe në vetinë res do të regjistrojmë rezultatin e ngritjes në katror:

data() {
	return {
		num: 0,
		res: 0
	}
}

Tani le të bëjmë një input, ta lidhim atë me vetinë num, të bëjmë një buton, me një klikim në të cilin do të ekzekutohet metoda calc, dhe të bëjmë gjithashtu një paragraf, në të cilin do të shfaqet rezultati:

<template>
	<p>{{ res }}</p>
	<input v-model="num">
	<button v-on:click="calc">work</button>
</template>

Le të shkruajmë zbatimin e metodës calc:

methods: {
	calc: function() {
		this.res = this.num ** 2;
	}
}

Do të ndodhë që, sapo të thirret metoda calc (dhe kjo do të ndodhë me një klikim në buton), në vetinë res do të shkruhet rezultati dhe në të njëjtën kohë do të shfaqet në paragrafin tonë.

Jepet një input. Jepet një buton. Jepet një paragraf. Në input futet një numër. Bëni që, me një klikim në buton, të shfaqet në paragraf rrënja katrore e këtij numri.

Jepen dy inpute. Jepet një buton. Jepet një paragraf. Në çdo input futen numra. Bëni që, me një klikim në buton, të shfaqet në paragraf shuma e këtyre numrave.

Jepen dy inpute. Jepet një buton. Në çdo input futet një tekst. Bëni që, me një klikim në buton, teksti i inputit të parë të shfaqet në të dytin dhe anasjelltas.

Jepet një input, 3 paragrafe dhe një buton. Në input futet Emri i Plotë i përdoruesit me hapësirë. Bëni që, me një klikim në buton, në paragrafin e parë të shfaqet mbiemri i përdoruesit, në të dytin - emri, dhe në të tretin - patronimiku.