Werk met radio in Vue

Werk met radio geskied op 'n soortgelyke wyse. Kom ons kyk na dit in die praktyk. Laat ons eers die eienskap choice maak, waaraan ons sal bind aan 'n groep radio:

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

Kom ons maak nou 'n groep radio:

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

Skryf vir elkeen van hulle die direktief v-model en bind dit aan die eienskap 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>

Gee ook vir elkeen van hulle hul eie 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>

Nou sal in die eienskap choice altyd die value van die gemerkte radio wees:

<template>
	jy het gekies: {{ choice }}
</template>

Vra die gebruiker met behulp van 'n groep radio, watter taal sy moedertaal is. Maak dit so dat die gekose taal in 'n paragraaf uitgedruk word

Verander die vorige taak op die volgende manier: laat ons drie paragrawe het met teks in verskillende tale. Afhangende van die keuse van die gebruiker, druk die frase uit in die taal wat hy gekies het.