Kufanya Kazi na Radio katika Vue

Kufanya kazi na radio hufanyika kwa njia ile ile. Hebu tuangalie kwa vitendo. Kwanza tufanye mali choice, ambayo tutaunganisha kwa kikundi cha radio:

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

Sasa tufanye kikundi cha radio:

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

Tuandikie kila moja diraktiva v-model na tuunganishe na mali 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>

Tupe pia kila moja value yake:

<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>

Sasa katika mali choice kutakuwa daima value ya radio iliyowekwa alama:

<template>
	umechagua: {{ choice }}
</template>

Muulize mtumiaji kwa kutumia kikundi cha radio, ni lugha gani ndiyo ya asili kwake. Fanya ili lugha iliyochaguliwa ionekane katika aya

Badilisha kazi iliyotangulia kwa namna ifuatayo: iwapo tuna aya tatu zenye maandishi kwa lugha tofauti. Kulingana na uchaguzi wa mtumiaji onyesha usemi kwa lugha aliyochagua.