Решено: используйте приложение History React Router v6.

Основная проблема, связанная с использованием History React Router v6, заключается в том, что он не поддерживает маршрутизацию на основе хэшей. Это означает, что все URL-адреса должны быть абсолютными путями, что может затруднить управление и обслуживание приложения. Кроме того, отсутствует встроенная поддержка динамических маршрутов, что может стать проблемой при создании сложных приложений с несколькими страницами. Наконец, History React Router v6 не поддерживает рендеринг на стороне сервера, который может быть необходим в некоторых случаях.

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>   ); }

// Этот код импортирует компоненты BrowserRouter, Switch, Route и useHistory из библиотеки react-router-dom.
// Затем создается функция App, которая использует хук useHistory для создания объекта истории.
// Этот объект истории используется в функции с именем handleClick, которая при вызове помещает новую запись в стек истории.
// Затем функция App возвращает некоторый JSX, который включает кнопку с обработчиком onClick, который вызывает handleClick при нажатии.
// Наконец, есть компонент Switch с одним компонентом Route внутри него, который отображает компонент NewLocation, когда его путь совпадает с «/new-location».

Что такое история использования

useHistory — это хук React, предоставляемый React Router, который позволяет компонентам получать доступ к объекту истории для программной навигации. Его можно использовать для добавления новых местоположений в стек истории, замены текущего местоположения, перехода вперед и назад по истории и т. д.

Как мне получить историю маршрутов в реакции

В React Router вы можете получить историю маршрутов, используя хук useHistory. Этот хук дает доступ к экземпляру истории, который вы можете использовать для навигации, перехода вперед и назад по истории вашего приложения и многого другого. Чтобы использовать его, просто импортируйте хук из React Router, а затем вызовите его в своем компоненте:

import {useHistory} из 'react-router-dom';

константа MyComponent = () => {
постоянная история = useHistory();

// Теперь вы можете получить доступ к истории маршрута через объект `history`.

возвращаться (…);
}

Использует ли реагирующий маршрутизатор API истории

Да, React Router использует API истории HTML5 для отслеживания текущего местоположения и его истории. Это позволяет React Router обновлять страницу без перезагрузки, что делает навигацию более быстрой и плавной. History API также позволяет создавать прямые ссылки, что упрощает пользователям обмен ссылками, ведущими непосредственно на определенную страницу в приложении.

Похожие посты:

Оставьте комментарий