部署后，React路由器不起作用

Question

我在Google云平台上部署了一个react-app：https://just-palace-214904.appspot.com/

但是只显示第一页，超链接不起作用。当我在localhost上运行应用程序时，它们工作正常。以下是我的设置：

index.js：

import React from 'react';
import ReactDOM from 'react-dom';
import {BrowserRouter, Route, Switch} from 'react-router-dom'
import SignIn from './components/SignIn';
import SignUp from './components/SignUp';
import ForgotPass from './components/ForgotPass';

ReactDOM.render((<BrowserRouter>
  <Switch>
    <Route exact={true} path="/" component={SignIn}/>
    <Route path="/signup" component={SignUp}/>
    <Route path="/forgot" component={ForgotPass}/>
  </Switch>
</BrowserRouter>), document.getElementById('root'));

我的超链接：

<a href="/forgot">Forgot password?</a><br/>
<a href="/signup">Create account</a>

Answer 1

您应该使用Link而不是锚标签。

更改

 <a href="/forgot">Forgot password?</a><br/>
 <a href="/signup">Create account</a>

至

<Link to="/forgot">Forgot Password?</Link><br/>
<Link to="/signup">Create account</Link>

Link来自react-router-dom包。

这是工作示例。 https://codesandbox.io/s/qz4l7nzv09

Answer 2

我不知道为什么，我之前遇到的类似问题并使用HashRouter工作正常而不是使用BrowserRouter：

import { HashRouter } from 'react-router-dom'

---

啊，我发现了一个博客解释他们之间的差异here。

当你有一个处理动态请求的服务器（知道如何响应任何可能的URI）时应该使用BrowserRouter，而HashRouter应该用于静态网站（服务器只能响应它知道的文件请求） ）。