React-da çekbokslar we şertli render
Çekboksuň bellengine görä, ekrana ýa bir kod bölegi, ýa-da beýlekisi çyksyn. Bunuň üçin şertli renderlemeginden peýdalanalyň:
function App() {
const [checked, setChecked] = useState(true);
let message;
if (checked) {
message = <p>habar 1</p>;
} else {
message = <p>habar 2</p>;
}
return <div>
<input type="checkbox" checked={checked} onChange={() => setChecked(!checked)} />
<div>{message}</div>
</div>;
}
Çekboks berlen. Çekboks arkaly ulanyjydan, eýýäm
18 ýaşy bar my, diýip soraň. Çekboks bellensi,
ulanyjyda indiki kod bölegini görkeziň:
<div>
<h2>Hur, size eýýäm 18 ýaş</h2>
<p>
bir ýerde diňe uly adamlara niýetlenen mazmun ýerleşdirilen
</p>
</div>
Eger çekboks bellinmedik bolsa - onda indiki:
<div>
<p>
gynansak, size heniz 18 ýaş ýok:(
</p>
</div>
Çekboks we abzas berlen. Çekboks bellensi bolsa, abzas ekranda görünýär bolsun, eger bellinmedik bolsa - ony gizläň.
