Главни проблем везан за прослеђивање података у историји реацт рутера, пусх је тај што се подаци не задржавају током освежавања странице. Када корисник освежи страницу, подаци сачувани у хистори.пусх ће бити изгубљени и неће бити доступни за коришћење при наредним учитавањима странице. Ово може довести до неочекиваног понашања и може изазвати проблеме када покушавате да приступите или сачувате податке из претходног учитавања странице.
import { useHistory } from "react-router-dom";
const MyComponent = () => {
const history = useHistory();
const handleClick = (data) => {
history.push({ pathname: "/mypage", state: data });
};
return <button onClick={() => handleClick({ someData: "data" })}>Go</button>;
};
1. Ова линија увози усеХистори куку из библиотеке реацт-роутер-дом, која обезбеђује приступ објекту историје који прати тренутну локацију у апликацији.
2. Ова линија декларише функционалну компоненту која се зове МиЦомпонент и додељује је константној променљивој.
3. Ова линија користи усеХистори куку увезену у линији 1 да би добила приступ објекту историје и доделила га константној променљивој која се зове историја.
4. Ова линија декларише функцију која се зове хандлеЦлицк која узима аргумент који се зове подаци и гура објекат који садржи име путање и својства стања у стек историје користећи хистори.пусх().
5. Ова линија враћа елемент дугмета са онЦлицк обрађивачем догађаја који позива хандлеЦлицк() са објектом који садржи сомеДата као аргумент када корисник кликне на њега.
Историја гурање
Гурање историје у Реацт Роутер-у је метод који се користи за програмску промену УРЛ-а у претраживачу без изазивања освежавања странице. Омогућава програмерима да креирају апликације на једној страници које су и даље у стању да управљају навигацијом и дубоким повезивањем. Притискање историје функционише коришћењем АПИ-ја историје претраживача, који омогућава програмерима да манипулишу тренутним УРЛ-ом без поновног учитавања странице. Ово омогућава корисницима да се крећу између различитих страница апликације без потребе да се сваки пут поново учитавају. Поред тога, може се користити за дубинско повезивање, омогућавајући корисницима да се директно повежу са одређеним деловима апликације.
Како да користим историју у реацт рутеру
Реацт Роутер пружа начин за коришћење историје у вашим Реацт апликацијама. Историја вам омогућава да пратите тренутну страницу, као и све претходне странице које сте посећивали. Ово је корисно за креирање навигације и праћење радњи корисника.
Да бисте користили историју у Реацт Роутер-у, потребно је да креирате објекат историје користећи методу цреатеХистори() из пакета историје. Ово ће вам омогућити приступ методама као што су пусх(), реплаце() и го(). Ове методе вам омогућавају да манипулишете УРЛ-ом претраживача и навигирате између различитих рута у вашој апликацији. Такође можете да користите метод листен() да бисте слушали промене у УРЛ-у и у складу са тим ажурирали своју апликацију.
Када креирате објекат историје, можете га проследити у компоненту рутера када га креирате. Ово ће омогућити Реацт Роутер-у да прати све промене које су направили корисници и да ажурира у складу са тим.
Коришћење историје са Реацт Роутер-ом олакшава програмерима да креирају моћне компоненте за навигацију које су корисницима лаке за разумевање и интеракцију са њима.
