Yakagadziriswa: Maitiro ekutungamirazve muReact Router v6

Dambudziko guru rine chekuita nekutungamirazve muReact Router v6 nderekuti iyo syntax yekudzosera yachinja zvakanyanya kubva kune dzakapfuura shanduro. Muv6, iyo Redirect chikamu chinofanira kushandiswa pachinzvimbo che element, uye iyo prop inofanirwa kupihwa nechinhu chine nzira yezita. Pamusoro pezvo, chero mapuropu ekuwedzera akadai senyika kana mubvunzo paramita inofanirwa kuverengerwa muchinhu ichi. Izvi zvinogona kuita kuti zviome kune vanogadzira vakajaira kushandisa yakapfava syntax yepakutanga shanduro dzeReact Router.

In React Router v6, you can use the <Redirect> component to redirect from one page to another.

Example: 

import { Redirect } from 'react-router-dom'; 
 
<Route exact path="/old-path"> 
   <Redirect to="/new-path" /> 
</Route>

1. import { Redirect } kubva 'react-router-dom';
-Mutsetse uyu unopinza iyo Redirect chikamu kubva kune react-router-dom raibhurari.

2.
-Mutsetse uyu unogadzira chikamu cheNzira ine nzira chaiyo ye "/ yekare-nzira".

3.
-Mutsetse uyu unoshandisa Redirect chikamu kutungamira kubva ku "/yekare-nzira" kuenda ku "/new-nzira".

Ndingaite sei kutungamira muReact Router v6

v6

React Router v6 inopa Redirect chikamu chinogona kushandiswa kutungamira vashandisi kubva kune rimwe peji kuenda kune rimwe. Kuti ushandise iyo Redirect chikamu, unofanirwa kuipinza kubva kune react-router-dom package. Iyo Redirect chikamu inotora maviri mapuropu: kubva uye kuenda. Iyo "kubva" prop ndiyo nzira yeizvino peji, uye "ku" prop ndiyo nzira yepeji yaunoda kuendesa vashandisi kwairi. Semuenzaniso, kana iwe waida kutungamira vashandisi kubva / peji repamba kuenda / nezve, kodhi yako yaizoita seizvi:

import {Redirect } kubva 'react-router-dom';

Chii chinonzi react router?

React Router iraibhurari yenzira yeReact iyo inobvumira vanogadzira kugadzira-peji rimwe chete maapplication ane kufamba uye ane simba, nyika-yakavakirwa nzira. Inobatsira kuchengetedza UI mukuwirirana neURL, zvichiita kuti zvive nyore kuti vashandisi vagovane uye bhukimaki maURL. React Router inopawo zvine simba maficha senge kurodha, kudzivirira nzira, uye nzvimbo yekuchinja kubata.

Mhando dzeRouter mune react

React Router iraibhurari yenzira yeReact iyo inobvumira vanogadzira kuti vagadzire maapplication-peji rimwe chete nekufamba uye URL routing. Inopa mhando nhatu dzemarouta: BrowserRouter, HashRouter, uye MemoryRouter.

BrowserRouter: Iyi router inoshandisa iyo HTML5 nhoroondo API kuchengetedza UI yako mukuwirirana neURL. Inoshandiswa kana iwe uchida kushandisa chaiwo maURL mukushandisa kwako.

HashRouter: Iyi router inoshandisa hashi chikamu che URL (kureva, #) kuchengetedza UI yako ichienderana neURL. Inoshandiswa kana iwe usingade kushandisa maURL chaiwo kana paunoda kuenderana nemabhurawuza ekare asingatsigire HTML5 nhoroondo API.

MemoryRouter: Iyi router inochengeta nhoroondo yenzvimbo mundangariro uye haidyidzane nebrowser kero bar kana kugadzira maURL chaiwo. Inobatsira pakuedza zvinangwa kana nharaunda uko kushandisa maURL chaiwo kusiri kudiwa (semuenzaniso, server-side rendering).