Czechitas-podklady-WEB / daweb-vyuka

Studijní materiály pro DA Web na kodim.cz
https://kodim.cz/czechitas/daweb/
5 stars 38 forks source link

JS2 – úprava práce s výstupem JSX #770

Open FilipJirsak opened 5 months ago

FilipJirsak commented 5 months ago

Problém: výstup JSX je string, který se vkládá do innerHTML, takže tam nejde přímo navěšovat události. Ty se dají navěšovat pomocí querySelector, ale u seznamů už to přestane rozumně fungovat. Přes querySelectorAll se dají vybrat třeba všechna tlačítka v seznamu, ale pak je problém se znalostmi účastnic detekovat, na které tlačítko uživatel kliknul (konkrétně – vypíše se seznam záznam, u něj je tlačítko pro smazání, ale je problém vědět, které ID se má smazat).

Nápady: Upravit funkci render() tak, aby se jí předával i DOM element, kam se má obsah vyrenderovat. Uvnitř funkce pak můžeme použít renderování do DOMu a ne do stringu, tím pádem už tam budeme schopni navěsit i posluchače událostí. Pokud bude potřeba něco změnit (změnit text v nadpisu, přečíst obsah inputu), bude se muset pořád použít querySelector, ale to by neměl být problém.