Arbejde med radio i Vue

Arbejde med radio foregår på en tilsvarende måde. Lad os se på det i praksis. Til at starte med laver vi en egenskab choice, som vi vil binde til en gruppe af radio:

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

Lad os nu lave en gruppe af radio:

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

Lad os skrive direktivet v-model til hver af dem og binde den til egenskaben 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>

Lad os også give hver af dem deres egen 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>

Nu vil value fra den markerede radio altid ligge i egenskaben choice:

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

Spørg brugeren ved hjælp af en gruppe radio, hvilket sprog der er deres modersmål. Gør sådan, at det valgte sprog vises i et afsnit

Modificer den forrige opgave på følgende måde: lad os sige, at vi har tre afsnit med tekst på forskellige sprog. Afhængigt af brugerens valg, vis sætningen på det sprog, de har valgt.