Kuxazululiwe: npm react router dom%405

Inkinga enkulu ehlobene ne-npm react router dom ukuthi kungaba nzima ukulungisa iphutha nokuxazulula inkinga. Lokhu kungenxa yokuthi umtapo wolwazi awunikezi imininingwane eminingi mayelana nokuthi kwenzekani uma kwenzeka iphutha, okwenza kube nzima ukukhomba imbangela yangempela yenkinga. Ukwengeza, njengoba umtapo wezincwadi uhlala uvela, kungase kube nzima ukuhambisana nazo zonke izinguquko futhi uqinisekise ukuthi i-codebase yakho iyahambisana nazo.

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

const App = () => (
  <Router>
    <Route exact path="/" component={Home} />
    <Route path="/about" component={About} />
  </Router>
);

1. “ngenisa i-{ BrowserRouter as Router, Route } from 'react-router-dom';” – Lo mugqa ungenisa kwamanye amazwe izingxenye ze-BrowserRouter kanye ne-Route kumtapo wezincwadi we-react-router-dom.

2. “const App = () => (” – Lo mugqa umemezela njalo Uhlelo Lokusebenza olunikezwa umsebenzi womcibisholo.

I-3 "” – Lo mugqa unikeza ingxenye Yerutha kusukela kumtapo wezincwadi we-react-router-dom.

I-4 "” – Lo mugqa unikeza ingxenye yoMzila enendlela eqondile ethi '/' kanye nengxenye Yasekhaya njengengxenye yayo yengane.

I-5 "” – Lo mugqa unikeza ingxenye Yomzila ngendlela ethi '/mayelana' kanye nengxenye ethi Mayelana njengengxenye yayo yengane.

6. “” – Lokhu kuvala umaka we-Router, okubonisa ukuthi zonke ezinye izingxenye ziyizingane zayo kulesi simemezelo somsebenzi wohlelo Lokusebenza.

Yini i-npm Ngisabela i-router dom

I-React Router DOM iwumtapo womzila we-React. Ihlinzeka ngezingxenye ezibalulekile ezidingekayo ukuze udale uhlelo lokusebenza olunikwe amandla umzila, okuhlanganisa izingxenye ezifana nalezi , , Futhi . Iphinde inikeze amahhuku nemisebenzi evumela onjiniyela ukuthi bahlanganyele ngokohlelo nerutha, njengokuzulazula phakathi kwemizila nokufinyelela kumapharamitha womzila. I-NPM ingumphathi wephakheji ye-JavaScript evumela onjiniyela ukuthi bafake futhi baphathe kalula amaphakheji ezinkampani zangaphandle amaphrojekthi abo. Ngokusebenzisa i-NPM, abathuthukisi bangakwazi ukwengeza ngokushesha i-React Router DOM kuphrojekthi yabo ngaphandle kokuyilanda mathupha kuwebhusayithi esemthethweni.

Ngiyifaka kanjani i-react router dom

Ukufaka i-React Router Dom kulula futhi kuqondile. Okokuqala, udinga ukufaka iphakheji ye-react-router-dom kusuka ku-npm usebenzisa umyalo olandelayo:

`npm faka i-react-router-dom`

Uma isifakiwe, ungangenisa izingxenye ozidingayo kuphakheji ezingxenyeni zakho ze-React. Isibonelo, uma ufuna ukusebenzisa ingxenye ye-BrowserRouter:

`ngenisa { BrowserRouter } kusuka 'ku-react-router-dom'`

Ngemuva kwalokho ungayisebenzisa engxenyeni yakho kanje:
"`jsx
// Imizila yakho iya lapha ``

I-react dom iyafana ne-react router dom

Cha, i-React Router DOM ayifani ne-React DOM. I-React Router DOM iwumtapo wolwazi ohlinzeka ngemizila nokuzulazula kwezinhlelo zokusebenza ezakhiwe nge-React. Ivumela onjiniyela ukuthi bakhe imizila futhi baxhumanise izingxenye ndawonye, ​​​​okuvumela abasebenzisi ukuthi bazulazule phakathi kwamakhasi ahlukene kuhlelo lokusebenza. Ngakolunye uhlangothi, i-React DOM iwumtapo wolwazi ohlinzeka nge-API yokukhohlisa i-Document Object Model (DOM) yesiphequluli. Ivumela abathuthukisi ukuthi bakhe futhi babuyekeze izici ze-HTML ekhasini, kanye nokusingatha imicimbi efana nokuchofoza noma ukuthunyelwa kwefomu.

Iyiphi irutha elungele ukusabela

Irutha engcono kakhulu ye-React i-React Router. Iwumtapo womzila odumile wezinhlelo zokusebenza ze-React futhi inikeza izici ezifana nokufanisa umzila oguquguqukayo, ukuphatha ukuguqulwa kwendawo, nokukhiqizwa kwe-URL. Iphinde isekele ukunikezwa kohlangothi lweseva, okukuvumela ukuthi unikeze uhlelo lwakho lokusebenza kuseva ngaphambi kokuluthumela kuklayenti. Lokhu kwenza kube lula ukwenza izinhlelo zokusebenza ezilungele i-SEO ezingase zigaqelwe izinjini zokusesha.

Okuthunyelwe okuhlobene:

Shiya amazwana