Маршруты становятся неопределенными после refre sh в реакции

Question

App.jsx

<Router history={history}>
      <>
        <Switch>
          <Route path="/" exact component={HomePage} />          
          <Route path="/test/:id" exact component={TestPage} /> 
          <Route component={NotFound} />         
        </Switch>
      </>
</Router>

HomePage.jsx внутри render ()

<Link to="/test/1" >Test link</Link>

Когда я нажимаю на ссылку, страница успешно перенаправляет меня на http://localhost: 8080 / test / 1 , и я могу видеть страницу, но если я нажимаю refre sh, страница исчезает, и я вижу только пустой экран, также если я хочу получить к нему доступ извне, т.е. если я непосредственно набираю тот же URL в браузере, я не вижу страницу, она пустая. Как управлять им по refre sh и получить доступ к нему извне?

Сообщение на консоли я получаю по refre sh

Answer 1

Проблема в том, что приложение не может загрузить ваш основной. js скрипт из вашего второго URL (он пытается загрузить его из /test/main.js). Вам нужно использовать абсолютный путь для загрузки из / вместо /test

Замените ваш тег сценария этим (загрузка его из /main.js): <script type="text/javascript" src="/main.js">

Вы можете обратиться к этому ответу для более подробного объяснения: { ссылка }