Reagálás reagálni

Körülbelül egy hónapja kezdtem el tanulni a JavaScriptet, három héttel később belevágtam a React-ba azzal a küldetéssel, hogy létrehozzam egy egyszerű To Do lista alkalmazást. Mielőtt elkezdtem volna, elolvastam a React használatának előnyeit és hátrányait; gyors, az egyirányú adatáramlás hatékonyabbá teszi a hibakeresést, a VirtualDOM pedig gyorsabb és érzékenyebb frissítéseket tesz lehetővé, de a legnagyobb hátránynak az tűnt, hogy meredek tanulási görbéje van. Mivel eléggé új vagyok a programozásban, és ez az első keretrendszer/könyvtár, amit kipróbáltam, nem érzem úgy, hogy meg tudnám pontosan megbecsülni, hogy a React többé-kevésbé nehezebb-e átvenni, mint más keretrendszereket, de azt mondhatom, hogy talán ez volt a legidegesítőbb próbálkozásom, amit eddig próbálkoztam.

Hogy tisztázzuk, úgy gondolom, hogy a React valóban hasznos eszköz lehet, csak először rá kell jönnöm. Egyelőre nem írok le a Reactről alkotott véleményemről, de arról szerettem volna beszélni, hogy a React első néhány hete miért volt annyira frusztráló számomra (és valószínűleg sokaknak). A React minden célból a díszes pihe egy torta tetején. Tetszetősebbé, gyorsabbá teheti a program felépítését és használatát, és végső soron nagy előnyt jelenthet, ugyanakkor nagyon bonyolultnak és félelmetesnek tűnhet, még akkor is, ha a végén az egész olyan koncepciókra épül, amelyeket már ismersz. . Itt kezdődött a legtöbb React tanulási problémám. Elkapott a szösz, és elfelejtettem, hogy az egész alatt lényegében még mindig JavaScriptet csinálok.

Erre a felismerésre csak tegnap késő este jutottam. Azon dolgoztam, hogy hozzáadjak egy törlés gombot az alkalmazásomhoz, amely lehetővé teszi a felhasználó számára, hogy eltávolítsa az egyes teendők listáját. Már jó ideje dolgoztam egy technológiai ügynökkel a Bloc Front-End Slack csatornán, amikor végül azt mondtam: „Azt hiszem, valami alapvető dolgot hiányolok, mert nem értem, hogy ez mit csinál.” Az ügynök visszaírta, hogy felejtse el egy pillanatra a reagálást, és összpontosítson a JavaScriptre, mit tenne a JavaScriptben? Ezt találtam ki.

deleteTodo(index) {
const todoDelete = this.state.todos.filter((todos, i) =› i !== index); this.setState( { todos: todoDelete } );
}

A kiválasztott teendők törléséhez létre kellett hoznom egy szűrőt, amely összehasonlítja a „teendők” tömbjét a kiválasztott „teendővel”, és mindent visszaad, ami nem egyezik a kiválasztott elemmel. A szűrő átad bizonyos paramétereket, és új tömböt hoz létre azokból az elemekből, amelyek igaz értéket adtak vissza. Ha egyszer így néztem, ez már nem egy ijesztő React dolog volt, amiről azt hittem, hogy nem értem, ez csak egy egyszerű szűrési módszer, amit már több százszor megtettem. Ezután már csak az állapotot kellett beállítani, hogy a React frissítse a felhasználói felületet az új tömbünkkel. Ennek a konkrét esetnek a szintaxisa valahogy így néz ki:

this.setState( {az összetevőben eredetileg beállított állapot: az új szűrt lista});

Még sok mindent meg kell tanulnom a Reactről, de jó emlékezni arra, hogy a megfélemlítés gyakran inkább akadályt jelent, mint maguk a fogalmak nehézségei.

– MxOliver