Reactda Radio bilan Ishlash

Radio radio bilan ishlash, masalan, shu kabi checkboxlardan biroz farq qiladi. Muammo shundaki, bir nechta radiolar bitta holatga ega bo‘ladi, lekin turli value (qiymat)larga.

Shuning uchun ish quyidagicha amalga oshiriladi: har bir radio tugchasi uchun value atributiga o‘z qiymati yoziladi, checked atributiga esa alohida shart, u holat ma’lum bir qiymatga teng yoki yo‘qligini tekshiradi. Agar teng bo‘lsa - radio tugchasi belgilanadi, agar teng bo‘lmasa - belgilanmaydi.

Quyida tavsiflangan amalga oshirilishi:

function App() {
	const [value, setValue] = useState(1);
	
	function changeHandler(event) {
		setValue(event.target.value);
	}
	
	return <div>
		<input
			type="radio"
			name="radio"
			value="1"
			checked={value === '1' ? true : false}
			onChange={changeHandler}
		/>
		<input
			type="radio"
			name="radio"
			value="2"
			checked={value === '2' ? true : false}
			onChange={changeHandler}
		/>
		<input
			type="radio"
			name="radio"
			value="3"
			checked={value === '3' ? true : false}
			onChange={changeHandler}
		/>
	</div>
}

3 ta radio tugchasi berilgan. Abzas berilgan. Tanlangan radio tugchasining qiymati shu abzada chiqarilishi uchun qiling.

Radio tugchalari yordamida foydalanuvchidan uning sevimli dasturlash tilini so‘rang. Uning tanlovini abzada chiqaring. Agar JavaScript tili tanlangan bo‘lsa, foydalanuvchini maqtang.