Princip fungování React Router

Princip fungování React Router
« kdy: 30. 12. 2021, 21:55:35 »
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?
« Poslední změna: 30. 12. 2021, 23:57:53 od Petr Krčmář »


fos4

Re:React Router
« Odpověď #1 kdy: 30. 12. 2021, 23:32:51 »
Navigace se řeší pomocí history.pushState() a history.replaceState(), na googlu pak dohledáš podrobné informace :)

Re:React Router
« Odpověď #2 kdy: 30. 12. 2021, 23:52:55 »
Na webu je to dobře zdokumentované: https://reactrouter.com

Nic nezachytáváte. Prostě jenom pomocí komponenty <Routes> a vnořených <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> 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()), ale pro začátek vám stačí <Link>.

Re:Princip fungování React Router
« Odpověď #3 kdy: 31. 12. 2021, 17:15:07 »

Re:Princip fungování React Router
« Odpověď #4 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.
« Poslední změna: 31. 12. 2021, 17:45:45 od registrovany123 »


Re:Princip fungování React Router
« Odpověď #5 kdy: 05. 01. 2022, 20:02:24 »
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