React Router / Express – 刷新dynamicURL参数

当通过链接导航到“/ Article / 1 /”时，My React路由器工作正常，但是当我刷新浏览器时，它不再检测到我的文章组件。

Root.js

import React from 'react'; import { BrowserRouter as Router, Route, Link, browserHistory } from 'react-router-dom'; import Home from '../page/Home/Index'; import Article from '../page/Article/Index'; const Root = () => { return ( <Router history={browserHistory}> <div> <ul> <li><Link to={'/'}>Home</Link></li> <li><Link to={'/About'}>About</Link></li> </ul> <hr /> <Route exact path={'/'} component={Home} /> <Route path={'/Article/:id'} component={Article} /> </div> </Router> ); }; export default Root; 

Server.js

 var express = require('express'); var app = express(); app.use('/', express.static(__dirname + '/dist')); app.listen(9000, function() { console.log('listening on 9000.') }); 

我在网上读到，它可能与我没有在我的server.js通配符有关 – 任何人都可以指出我在正确的方向吗？ 先谢谢你！

编辑 – 这是我试过（仍然没有渲染）：

 app.use(express.static(__dirname + '/dist')) app.get('/*', function(req, res) { res.sendFile(path.join(__dirname + '/dist/index.html')); }); 

Answer 1

我在网上读到，它可能与我没有在我的server.js通配符有关

是的，就是这样。 这里的目标是让你的客户端处理路由而不是服务器，为此，你需要服务器返回客户端应用程序，而不pipe它得到什么URL。

简单的修复 – 更改/到/*您的服务器路线。