Rad sa radio dugmadima u Vue

Rad sa radio dugadima se odvija na sličan način. Hajde da pogledamo u praksi. Za početak, napravićemo svojstvo choice, koje ćemo vezati za grupu radio dugmadi:

data() {
	return {
		choice: '',
	}
}

Sada napravimo grupu radio dugmadi:

<template>
	<input name="radio" type="radio">
	<input name="radio" type="radio">
	<input name="radio" type="radio">
</template>

Svakom od njih dodelimo direktivu v-model i povežimo je sa svojstvom choice:

<template>
	<input name="radio" type="radio" v-model="choice">
	<input name="radio" type="radio" v-model="choice">
	<input name="radio" type="radio" v-model="choice">
</template>

Takođe dodelimo svakom svoju vrednost value:

<template>
	<input name="radio" type="radio" v-model="choice" value="v1">
	<input name="radio" type="radio" v-model="choice" value="v2">
	<input name="radio" type="radio" v-model="choice" value="v3">
</template>

Sada će u svojstvu choice uvek biti vrednost value označenog radio dugmeta:

<template>
	you choosed: {{ choice }}
</template>

Pitajte korisnika pomoću grupe radio dugmadi, koji je njegov maternji jezik. Učinite da se izabrani jezik prikaže u pasusu.

Modifikujte prethodni zadatak na sledeći način: neka imamo tri pasusa sa tekstom na različitim jezicima. U zavisnosti od korisnikovog izbora prikažite frazu na izabranom jeziku.