Kuxazululiwe: phendula intambo yerutha

Inkinga enkulu ehlobene nentambo ye-React Router ukuthi kungaba nzima ukuyilungisa ngendlela efanele. Kudinga ukusethwa nokucushwa okuningi, futhi uma kwenziwa ngendlela engalungile, kungaholela ekuziphatheni okungalindelekile noma amaphutha. Ukwengeza, imibhalo yentambo ye-React Router ayihlali icacile noma isesikhathini, okwenza kube nzima konjiniyela ukuxazulula izinkinga.

 add react-router-dom

import { BrowserRouter as Router, Route, Link } from "react-router-dom"; 

<Router> 
    <div> 
        <ul> 
            <li><Link to="/">Home</Link></li> 
            <li><Link to="/about">About</Link></li> 
            <li><Link to="/topics">Topics</Link></li> 
        </ul>

        <hr />

        <Route exact path="/" component={Home} /> 
        <Route path="/about" component={About} /> 
        <Route path="/topics" component={Topics} />  

    </div>  
</Router>

1. Lo mugqa ungenisa kwamanye amazwe izingxenye ze-BrowserRouter, Route, kanye ne-Link kusuka kumtapo wezincwadi we-react-router-dom:
ngenisa i-{ BrowserRouter as Router, Route, Link } isuka “ku-react-router-dom”;

2. Lo mugqa ugoqa lonke uhlelo lokusebenza engxenyeni Yomzila ukuze unikeze ukusebenza komzila:

3. Le ngxenye ye-div iqukethe uhlu lwezixhumanisi ezizosetshenziselwa ukuzulazula phakathi kwemizila eyahlukene:

  • Ikhaya
  • Mayelana
  • Izihloko

4. Lesi sici se-hr sisetshenziswa njengesihlukanisi esibonakalayo phakathi kwezixhumanisi zokuzulazula nokuqukethwe komzila:


5. Le migqa ichaza imizila emithathu ehlukene yohlelo lwethu lokusebenza kusetshenziswa ingxenye yeReact Router's Route:

6. Okokugcina, le div tag yokuvala ivala isici sethu se-wrapper div:

yini i-React Router

I-React Router iwumtapo womzila we-React ovumela onjiniyela ukuthi bakhe futhi baphathe imizila ngaphakathi kwezinhlelo zabo zokusebenza ze-React. Ihlinzeka ngendlela yokumepha ngokumemezela imizila ezingxenyeni, isingathe amapharamitha e-URL, nokuphatha imicimbi yokuzulazula. Iphinde inikeze izici ezifana nokufanisa umzila oguquguqukayo, ukuphatha ukuguqulwa kwendawo, nokubuyiselwa kokuskrola.

Yini i-Yarn

I-Yarn ingumphathi wephakeji ye-JavaScript esiza onjiniyela balawule ukuncika kwabo ngendlela ephumelela kakhulu nevikelekile. Isetshenziswa i-React Router ukuze ifake, ibuyekeze, futhi ilungiselele amaphakheji. I-Yarn iphinde isize onjiniyela ukuthi balandelele ukuncika kwephrojekthi yabo, baqinisekise ukuthi wonke amaphakheji adingekayo afakiwe futhi asesikhathini samanje. Lokhu kwenza kube lula ukusebenza kumaphrojekthi anonjiniyela abaningi njengoba ngamunye angabheka kalula ukuthi yiziphi izinguqulo zamaphakheji okudingeka awasebenzise.

Okuthunyelwe okuhlobene:

Shiya amazwana