反应刷新后路线未定义

Question

应用程序.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并且我可以看到页面但是如果我点击刷新页面消失了，我只能看到空白屏幕，如果我想从外部访问它，即如果我直接在浏览器上输入相同的 url，我看不到该页面，它是空白的。 如何在刷新时管理它并从外部访问它？

控制台上的消息我刷新了

Answer 1

问题是应用程序无法从您的第二个 url 加载您的 main.js 脚本（它尝试从 /test/main.js 加载它）。 您需要使用绝对路径从/而不是/test加载

用这个替换你的脚本标签（从 /main.js 加载它）： <script type="text/javascript" src="/main.js">

更详细的解释可以参考这个答案： https : //stackoverflow.com/a/24028813/3350692