An warware: wucewa data kewaya react router dom

Babban matsalar da ke da alaƙa da wucewar bayanai lokacin kewayawa tare da React Router DOM shine cewa dole ne a shigar da bayanan a cikin layin tambayar URL. Wannan yana nufin cewa duk wani bayani mai mahimmanci dole ne a ɓoye shi kafin a wuce shi, kamar yadda za a iya gani a cikin URL. Bugu da ƙari, idan bayanan sun yi girma, zai iya wuce iyakar tsawon URL kuma ya haifar da kurakurai. A ƙarshe, idan kuna amfani da React Router DOM don kewaya tsakanin shafuka a cikin aikace-aikacen, dole ne ku sarrafa jihar da hannu kuma ku ci gaba da bin canje-canje don tabbatar da cewa duk abubuwan haɗin gwiwa suna samun damar yin amfani da bayanai iri ɗaya.

import { useHistory } from "react-router-dom";

const MyComponent = () => {
  const history = useHistory();

  const handleClick = (data) => {
    history.push({ pathname: '/myroute', state: data }); // pass data to route as state object
  };

  return (
    <button onClick={() => handleClick(data)}>Go to MyRoute</button>
  );
};

Layin 1: Wannan layin yana shigo da ƙugiya ta amfani da Tarihi daga ɗakin karatu na react-router-dom.
// Layin 3: Wannan layin yana bayyana madaidaicin da ake kira MyComponent wanda shine aikin da ke dawo da JSX.
Layin 4: Wannan layin yana bayyana tarihin da ake kira akai-akai wanda aka sanya shi zuwa amfani da ƙugiya na Tarihi wanda aka shigo da shi daga react-router-dom.
Layin 6: Wannan layin yana bayyana wani aiki da ake kira handleClick wanda ke ɗauka a cikin siga guda ɗaya, bayanai.
Layi 7: Wannan layin yana amfani da abun tarihi don tura sabuwar hanya zuwa kan tari mai suna '/myroute' da bayanan jihar da aka wuce azaman abu.
Layi na 9 – 11: Waɗannan layukan sun dawo JSX mai ɗauke da maɓalli mai maɓalli tare da mai sarrafa taron onClick wanda ke kiran handleClick kuma ya wuce cikin bayanai azaman hujja.

React Router Dom

React Router DOM babban ɗakin karatu ne don React wanda ke ba masu haɓakawa damar ƙirƙira da sarrafa hanyoyin cikin aikace-aikacen React ɗin su. Yana ba da ainihin abubuwan da ake buƙata don gina hadaddun, aikace-aikacen gidan yanar gizo masu shafuka da yawa tare da React, gami da abubuwan haɗin gwiwa kamar Link, Route, Switch, da BrowserRouter. Hakanan yana ba da fasali kamar daidaitawar hanya mai ƙarfi da bin diddigin wuri. Tare da React Router DOM, masu haɓakawa zasu iya ƙirƙirar aikace-aikacen shafi ɗaya cikin sauƙi tare da ra'ayoyi da hanyoyi da yawa ba tare da sarrafa URL ko tarihin burauzar da hannu ba.

Ta yaya kuke shigar da bayanai ta hanyar kewayawa a cikin react-router-Dom

A cikin React Router, ana iya wuce bayanai ta hanyar kewayawa ta amfani da abin da ke cikin tarihin API. Ana iya samun dama ga abun jihar ta hanyar kayan aikin kowane bangare da aka yi ta a bangaren. Don ƙaddamar da bayanai, zaku iya ƙara shi zuwa abu na jiha lokacin kiran aikin kewayawa. Misali:

const {tarihi} = wannan.props;
tarihi.push({
hanyar sunan: '/ wasu / hanya',
state: {wasu Data: 'data'}
});

Shafi posts:

Leave a Comment