React-da massiwler bilen reaksiýa amallary

Indi massiw elementleri bilen reaksiýaly manipulýasiýalar etmegi öwreneliň. Munuň üçin her bir li üçin wakany işleýji goýarys, onda bu li -iň massiwdäki nomerini parametr hökmünde ibereris:

function App() {
	const [notes, setNotes] = useState([1, 2, 3, 4, 5]);
	
	const result = notes.map((note, index) => {
		return <li key={index} onClick={() => doSmth(index)}>
			{note}
		</li>;
	});
	
	return <div>
		<ul>
			{result}
		</ul>
	</div>;
}

Funksiýamyzyň içinde biz massiw elementimiz üçine islendik amaly ýerine ýetirip bileris:

function App() {
	...
	
	function doSmth(index) {
		let copy = Object.assign([], notes);
		copy[index] += '!'; // element bilen bir zat ederis
		setNotes(copy);
	}
}

Sanlar bilen massiw berlen. Ony ul sanawy görnüşinde çykaryň. Islendik li -e basylanynda onuň sanyny kwadrata kökelt.

Her bir li -iň ahyrynda düwmäni ýasaň, basaňyşda şol li sanawdan aýrylsyn.

Inpit berlen. Islendik li -e basylanynda şol li -iň teksti inpite düşmekligini üpjün ediň.

Öňki meseläni üýtgediň, şonuň ýaly inpit fokusy ýitirilende üýtgedilen teksti degişli li -e düşsin.

Düwme berlen. Bu düwmä basylanynda li -leriň tertibini tersine öwüriň.