部署React应用程序，路由器不正确
部署React应用程序，路由器不正确
提问于 2019-08-12 10:29:54
我正在开发React应用程序，并试图在IIS上进行部署。
它工作良好，但路由器没有正确显示。
当我单击“测试”链接时，我的预期路径是“http://localhost/test/TestRouter/”，但它显示的是“http://localhost/TestRouter/”。
这是我的代码：
App.js
import React from 'react';
import logo from './logo.svg';
import './App.css';
import Test from './Test';
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
function App() {
return (
<div className="App">
<Router>
<div>
<nav>
<ul>
<li>
<Link to="/TestRouter/">Test</Link>
</li>
</ul>
</nav>
<Route path="/TestRouter/" component={Test} />
</div>
</Router>
</div>
);
}
export default App;Test.js
import React from 'react';
class Test extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>
<p>Test</p>
</div>
);
}
}
export default Test;package.json：
"homepage": "/test/",然后在IIS上部署默认网站/测试
我的问题是，当我点击‘测试’链接，url现在显示'http://localhost/TestRouter/‘。
我的期望是url应该显示'http://localhost/test/TestRouter/‘。
这里有人能帮我纠正路由器吗？
谢谢你的进阶。
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-08-12 10:32:49
您需要将basename添加到路由器：
<Router basename='/test'>Stack Overflow用户
发布于 2019-08-12 11:45:52
Path=“测试/测试路由器”
有直接填充路径的选项。
<Router>
<div>
<nav>
<ul>
<li>
<Link to="/test/TestRouter">Test</Link>
</li>
</ul>
</nav>
<Route path="test/TestRouter" component={Test} />
</div>
</Router>和选项，如这里的评论
<Router basename='/test'>
<div>
<nav>
<ul>
<li>
<Link to="/TestRouter">Test</Link>
</li>
</ul>
</nav>
<Route path="/TestRouter" component={Test} />
</div>
</Router>你确定你按它写的试过了吗？
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/57459560
复制相关文章
相似问题
腾讯云开发者
