Ahojte viete mi prosím vysvetliť princíp fungovania react routera?
Viem že napríklad routovanie pomocou hashov sa robí odchytávaním hashchange, ale ako odchytávať zmeny cesty bez hashu?
Navigace se řeší pomocí history.pushState() a history.replaceState(), na googlu pak dohledáš podrobné informace :)
Na webu je to dobře zdokumentované: https://reactrouter.com (https://reactrouter.com)
Nic nezachytáváte. Prostě jenom pomocí komponenty <Routes> a vnořených <Route> (https://reactrouter.com/docs/en/v6/api#routes-and-route) vytvoříte bloky stránky, které se budou zobrazovat, když je aktivní příslušná routa. Kvůli přehlednosti se to dělá tak, že jedna routa je jedna komponenta. Pomocí komponenty <Link> (https://reactrouter.com/docs/en/v6/api#link) se pak dělají odkazy na jednotlivé routy. Změnit routu jde i programově (ale nedělá se to pomocí history, což je nativní objekt prohlížeče, nýbrž pomocí useNavigate() (https://reactrouter.com/docs/en/v6/api#usenavigate)), ale pro začátek vám stačí <Link>.
Princip je ten, ze server ti na www.frantovo.cz/ vrati tvuj index.html, a kdyz napises www.frantovo.cz/nastaveni/delka-frantova-penisu tak ti server opet vrati index.html, ale tvuj javascript v tom index.html ti vrati routu nastaveni/delka-frantova-penisu
A druhy princip funcke je ten, ze kdyz kliknes na nejky link v index.html, kteryto ma byt jen routa, tak ti to javascript vykonny kod neposle na server, ale misto toho ti to jenaom nejak strci ten string do url pole v browseru.
Citace od: registrovany123 kdy 31. 12. 2021, 17:43:40
Princip je ten, ze server ti na www.frantovo.cz/ vrati tvuj index.html, a kdyz napises www.frantovo.cz/nastaveni/delka-frantova-penisu tak ti server opet vrati index.html, ale tvuj javascript v tom index.html ti vrati routu nastaveni/delka-frantova-penisu
A druhy princip funcke je ten, ze kdyz kliknes na nejky link v index.html, kteryto ma byt jen routa, tak ti to javascript vykonny kod neposle na server, ale misto toho ti to jenaom nejak strci ten string do url pole v browseru.
Dik nakoniec som to ajtak spravil cez hashe. Ale možno to predsa len prerobím do linkov bez hashov. Ten druhý princíp sa mi pozdáva viac a to sa asi robí asi robí cez history.pushState() a history.replaceState() tak ako písal
fos4 alebo useNavigate() ako písal Filip Jirsák.
Ale ten example odkaz :D rofl