Fórum Root.cz

Hlavní témata => Vývoj => Téma založeno: frank128 30. 12. 2021, 21:55:35

Název: Princip fungování React Router
Přispěvatel: frank128 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?
Název: Re:React Router
Přispěvatel: fos4 30. 12. 2021, 23:32:51
Navigace se řeší pomocí history.pushState() a history.replaceState(), na googlu pak dohledáš podrobné informace :)
Název: Re:React Router
Přispěvatel: Filip Jirsák (forum) 30. 12. 2021, 23:52:55
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>.
Název: Re:Princip fungování React Router
Přispěvatel: frank128 31. 12. 2021, 17:15:07
Citace: fos4  30. 12. 2021, 23:32:51
...

Citace: Filip Jirsák  30. 12. 2021, 23:52:55
...

Dakujem Vám obom za informácie.
Název: Re:Princip fungování React Router
Přispěvatel: registrovany123 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.
Název: Re:Princip fungování React Router
Přispěvatel: frank128 05. 01. 2022, 20:02:24
Citace: registrovany123  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