使用React-Router时,您只能将原始index.html与Node一起提供,因为客户端会处理其余部分。我了解一旦用户进入主页,如何在不同页面之间进行路由。但是,假设用户在URL中输入“ / about”。 Node将提供index.html,但是如何告诉React-Router立即将用户带到About页面?谢谢。
答案 0 :(得分:0)
您必须像这样定义与“ / about”匹配的路线:
在您的主应用中:
import {
BrowserRouter as Router,
Switch
} from 'react-router-dom';
...
render() {
return (
<Router>
<Switch>
<Route exact path="/" component={Home}/>
<Route exact path="/about" component={About}/>
<Route component={NotFound}/>
</Switch>
</Router>
);
}
基本上,您可以根据需要添加任意数量的路由,并且只要它们与路由中定义的确切路径匹配,React Router就会处理它们。
我添加的最后一条路由将匹配任何不匹配的路由,例如,如果用户键入URL'/ MyInventedPath'或任何其他404(未找到)。
Official documentation非常好,并且易于遵循,因此您可以了解它的工作原理以及如何使用其他组件。
答案 1 :(得分:0)
如果您的BUILT create-react-app项目位于节点/公用文件夹中。您需要让express知道index.html文件将处理路由。请参阅下面的超级简单服务器示例。这将正确使用反应路由器设置。
const express = require('express');
const app = express();
const path = require('path');
app.use(express.static(path.join(__dirname, 'public')));
app.get('*', (req, res) => res.sendFile(path.join(__dirname, 'public/index.html')));
app.listen(3000);