Reactда radio билан ишлаш

radio radio билан ишлаш бир оз фарк қилади, масалан, ўша чекбокслардан. Муаммо шундаки, бир нечта radio-нинг битта стейти бўлади, лекин турли value.

Шу сабабдан иш куйидагича олиб борилади: ҳар бир radio-туғмасига value атрибутига ўз қиймати ёзилади, checked атрибутига эса - стейт маълум бир қийматга тенг-ю ёқанини текширадиган махсус шарт. Агар тенг бўлса - radio-туғмачаси белгиланган бўлади, тенг бўлмаса - белгиланмаган бўлади.

Тавсифланганнинг амалга оширилиши:

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 та radio-туғмача берилган. Абзац берилган. Танланган radio-туғмачанинг қиймати ушбу абзацда чиқарилишини таъминланг.

Radio-туғмачалар ёрдамида фойдаланувчидан унинг севимли дастурлаш тини сўранг. Унинг танловини абзацда чиқаринг. Агар JavaScript тии танланган бўлса, фойдаланувчини мақтанг.