An warware: Yi amfani da Tarihi React Router v6 app

Babban matsalar da ke da alaƙa da amfani da History React Router v6 shine cewa baya goyan bayan tuƙi na tushen zanta. Wannan yana nufin cewa duk URLs dole ne su zama cikakkun hanyoyi, wanda zai iya yin wahalar sarrafawa da kiyaye aikace-aikacen. Bugu da ƙari, babu wani ginanniyar tallafi don hanyoyi masu ƙarfi, wanda zai iya zama matsala lokacin ƙirƙirar ƙaƙƙarfan aikace-aikace tare da shafuka masu yawa. A ƙarshe, Tarihi React Router v6 baya bayar da kowane tallafi don ma'anar sabar-gefen sabar, wanda zai iya zama dole a wasu lokuta.

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

 function App() {

   const history = useHistory();

   // Handle a button click to push a new entry onto the history stack.
   function handleClick() {
     history.push("/new-location");
   }

   return (
     <div>      
       <button type="button" onClick={handleClick}>Go to New Location</button>       

       <Switch>        
         <Route path="/new-location">          
           <NewLocation />        
         </Route>      

       </Switch>    

     </div>   ); }

// Wannan lambar tana shigo da BrowserRouter, Sauyawa, Hanya, da amfani da abubuwan Tarihi daga ɗakin karatu na amsa-router-dom.
// Sannan yana ƙirƙirar wani aiki mai suna App wanda ke amfani da ƙugiya ta tarihi don ƙirƙirar abun tarihi.
// Ana amfani da wannan abu na tarihi a cikin wani aiki da ake kira handleClick wanda ke tura sabon shigarwa akan tarihin tarihin lokacin da aka kira shi.
// Ayyukan App sai ya dawo da wasu JSX wanda ya haɗa da maɓalli tare da mai kula da onClick wanda ke kira handleClick lokacin da aka danna.
// A ƙarshe, akwai wani ɓangaren Sauyawa tare da bangaren Route guda ɗaya a cikinsa wanda ke sanya bangaren NewLocation lokacin da hanyarsa ta dace da "/ sabon wuri".

Menene tarihin amfani

UseHistory wani React Hook ne wanda React Router ke bayarwa wanda ke ba da damar abubuwan haɗin gwiwa don samun damar abun tarihin don kewaya ta tsari. Ana iya amfani da shi don tura sabbin wurare zuwa tarin tarihi, maye gurbin wurin da ake ciki, komawa baya a tarihi, da sauransu.

Ta yaya zan sami tarihin hanya a cikin martani

A cikin React Router, zaku iya samun tarihin hanya ta amfani da ƙugiya ta amfani da Tarihi. Wannan ƙugiya tana ba da damar yin amfani da misalin tarihin da za ku iya amfani da shi don kewayawa, komowa da gaba a cikin tarihin app ɗin ku, da ƙari. Don amfani da shi, kawai shigo da ƙugiya daga React Router sannan ku kira shi a cikin sashin ku:

shigo da {amfaniHistory} daga 'react-router-dom';

const MyComponent = () => {
tarihin tarihi = tarihin amfani ();

// Yanzu zaku iya samun damar tarihin hanya ta hanyar abu 'tarihi'.

dawo (...);
}

Yana amsa mai amfani da na'ura mai ba da hanya tsakanin hanyoyin sadarwa API

Ee, React Router yana amfani da HTML5 History API don kiyaye yanayin wurin da ake ciki da tarihinsa. Wannan yana ba da damar React Router don sabunta shafin ba tare da sake loda shi ba, yin kewayawa cikin sauri da sauƙi. API ɗin Tarihi kuma yana ba da damar haɗin kai mai zurfi, wanda ke sauƙaƙa wa masu amfani don raba hanyoyin haɗin kai waɗanda ke kai su kai tsaye zuwa takamaiman shafi a cikin aikace-aikacen.