Использование hookrouter с create-реагировать-приложение не в состоянии обновить представление при изменении навигации

Question

Я пытаюсь получить самый базовый c пример работы hookrouter (альтернативной библиотеки маршрутизации для response-router-dom) и не могу изменить страницу. URL-адрес изменится на / about, когда я нажму на ссылку / about, но пользовательский интерфейс не обновится. Я использую его с новым проектом create-реагировать на приложение. Я попробовал тот же проект на StackBlitz и заметил, что после установки hookrouter он сказал, что для библиотеки 'url' не хватает пакета / зависимости .... что интересно, поскольку пакет url не является зависимостью от hookrouter. Но после того, как я установил пакет url на StackBlitz.io, ссылки работали и пользовательский интерфейс обновлялся соответствующим образом при изменении URL. Я попытался установить библиотеку url в свой локальный проект create-реагировать на приложение, и это не помогло исправить ситуацию. Поэтому я не уверен, что существует отсутствующая зависимость, но я вижу, что хук useRoutes фактически загружает изменение при изменении URL, но по какой-либо причине пользовательский интерфейс не будет обновляться. Вот мой код для моего файла приложения. js.

import { A, useRoutes } from 'hookrouter';
import React from 'react';
import './App.css';
import { AboutPage } from './pages/AboutPage';
import { HomePage } from './pages/HomePage';

const routes = {
  '/': () => <HomePage />,
  '/about': () => <AboutPage />
}

function App() {
  const routeResult = useRoutes(routes);

  return (
    <div className="App">
      <A href="/">Home</A>
      <A href="/about">About</A>
      <header className="App-header">
        {routeResult}
      </header>
    </div>
  );
}

export default App;

Answer 1

Кажется, что hookrouter не работает с Строгий режим , который включен по умолчанию в последних версиях CRA. (то же самое, я думаю, со StackBlitz и codesandbox)

Вам нужно просто удалить компонент <React.StrictMode> из индекса . js

<React.StrictMode>
  <App />
</React.StrictMode>

codesandbox emaple

С учетом сказанного, если у вас нет действительно простого приложения, я рекомендую вам использовать react-router-dom, поскольку этот пакет относительно новый и у вас могут быть более необычные ошибки.