路由不是在构建 React JS Web 应用程序之后

Question

我在 React js 中创建了一个应用程序。在开发模式下一切正常，但是在构建路由之后无法正常工作。

我的包.json 文件代码

{ "homepage": "http://localhost/hositng/react/",
"private": true,
"entry": {
"index": "./index.js"
},
}

我的路由文件代码

const Routes = () => (
<BrowserRouter basename="http://localhost/hositng/react" >
<Switch>
<Route exact path='/' component={Login} />
<Route path='/login' component={Login} />
<Route path='/home' component={Home} />
<Route path='/contact' component={Contact} />
</Switch>
</BrowserRouter>);

反应构建命令后，当我点击"http://localhost/hositng/react/"url 时

1. 它应该转到登录页面，但它将转到主页

2. 当单击"联系我们"页面链接时，它将转到联系人页面URL正在发生变化。

   它应该转到此网址"http://localhost/hositng/react/contact" 但 它将"http://localhost/contact"此网址

但是当我用这个 url 刷新浏览器"http://localhost/contact"时，空白页面即将到来

Answer 1

Switch 中定义的路由看起来不错。我已经用过它并且它有效。 我建议在 basename 属性中使用相对路径而不是绝对路径。

<BrowserRouter basename="/hositng/react" >

有关它的更多信息 浏览器路由器文档