Блог

У меня очень простая настройка, я пробую react router v6. Но я всегда получаю сообщение об ошибке, упомянутое в заголовке, когда я нажимаю на кнопку «перейти домой». Как я могу это исправить?

App.js

 render({AppRoutes})
  

AppRoutes.js

 import { BrowserRouter, Routes, Route, HashRouter } from 'react-router-dom';
import React from 'react';
import DefaultComponent from './scenes/Default/Default2';
import TestComponent from './scenes/Default/TestComponent';

const AppRoutes = (
<HashRouter>
  <Routes>
    <Route path="/" element = {<DefaultComponent/>}>
      <Route path="test" element={<TestComponent/>}/>
    </Route>
  </Routes>
</HashRouter>
);
export default AppRoutes;
  

DefaultComponent.js

 import React from 'react';
import { useNavigate } from 'react-router-dom';

function DefaultComponent() {
  let navigate = useNavigate();
  function handleClick() {
    navigate('/test');
  }
  return (
    <div>
      <button onClick={handleClick}>go home</button>
    </div>
  );
}
export default DefaultComponent;
  

TestComponent.js

 import React from 'react';

function TestComponent (){
  return (
    <h1>This is a test!</h1>
  );
}
export default TestComponent;