Reaction JS路径未显示组件 [英] React js route is not showing the component
本文介绍了Reaction JS路径未显示组件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
当我在路由外调用组件时,它工作得很好,但在路由内它不工作。
App.js文件为:
import './App.css';
import Login from './Components/Login/Login';
import { BrowserRouter as Router, Switch, Route, Redirect } from "react-router-dom";
import Protected from './Components/Common/Protected';
function App() {
return (
<div className="App">
<Router>
<Switch>
<Redirect exact from="/" to="/Login" >
<Route exact path="/Login" > <Login /> </Route>
</Redirect>
</Switch>
</Router>
</div>
);
}
导出默认应用;
这些是我的包:
{
"name": "frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.11.2",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^12.8.3",
"ag-grid-community": "^26.0.0",
"ag-grid-enterprise": "^26.0.1",
"ag-grid-react": "^26.0.0",
"material-table": "^1.69.3",
"react": "^17.0.2",
"react-bootstrap": "^1.6.1",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.1",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.2",
"xlsx": "^0.17.1"
},
推荐答案
重定向需要位于交换机内部的最后。以下是呈现登录所需的内容:
return (
<Switch>
<Route exact path="/login">
<Login />
</Route>
<Redirect to="/login" />
</Switch>
);
这篇关于Reaction JS路径未显示组件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文