Существует множество различных версий реагирующей маршрутизации, поскольку разработчики могут посчитать существующие пакеты сложными в использовании, или понять, и написать свой собственный пакет. Добро пожаловать в удивительный мир фрагментации JavaScript, p
Как вы можете видеть на странице npm для react-router, это широко используемый и хорошо поддерживаемый пакет: https://www.npmjs.com/package/react-router
Если вам интересно, почему существуют различные Routers в react-router, каждый компонент обеспечивает свое собственное назначение и использование / случай:
BrowserRouter: использует API истории HTML5 (pushState, replaceState и событие popstate) для синхронизации вашего пользовательского интерфейса с URL.
HashRouter: использует хэш-часть URL-адреса (т.е. window.location.hash) для синхронизации вашего пользовательского интерфейса с URL-адресом.
MemoryRouter: Сохраняет историю вашего «URL» в памяти (не читает и не записывает в адресную строку). Полезно в тестах и не браузерных средах, таких как React Native.
StaticRouter: Маршрутизатор, который никогда не меняет местоположение. Это может быть полезно в сценариях рендеринга на стороне сервера, когда пользователь фактически не щелкает, поэтому местоположение фактически никогда не меняется. Следовательно, название: статическое. Это также полезно в простых тестах, когда вам просто нужно подключить местоположение и сделать утверждения на выходе рендеринга.
React - мощная библиотека с большой экосистемой. Я рекомендую ознакомиться с официальными документами и сообщениями по реакции, чтобы набрать скорость.
ОБНОВЛЕНИЕ: Почему-то проголосовали, поэтому я добавляю дополнительную информацию
BrowserRouter используется для маршрутизации на стороне клиента с сегментами URL. Вы можете загрузить компонент верхнего уровня для каждого маршрута. Это помогает разделить проблемы в вашем приложении и делает логику / поток данных более понятным.
Например
/ - Home Component (root route of your app, this can be configured)
/login - Auth component, which handles login, forgot password and signup
/dashboard - Dashboard component
/etc - Some Other Component
/etc/another - Another Component, your routing can go as deep as you need
Этот вид маршрутизации на стороне клиента делает ваше одностраничное приложение более похожим на традиционную веб-страницу / веб-приложение. Это также облегчает обмен ссылками на определенную страницу в вашем приложении, например:
/ items / 1234 - Загрузите компонент Item, и вы можете получить 1234, который может быть id из react-router и загрузить ресурс