首页 > 解决方案 > 反应路由器不改变路径

问题描述

import * as React from "react";
import { BrowserRouter as Router,Switch,Route,Link,useHistory } from "react-router-dom";
import Login from "./login/index";
import MainFrame from "./main-frame/index";

const MainWrapper = () => {

  return (
    <div>
      <Router>      
      <Switch>
          <Route path="/main-frame">
          <MainFrame  /> 
          </Route>
          <Route exact path="/">
          <Login />
          </Route> 
          <Route exact path="/i">
          <p>sdf</p>
          </Route>       
        </Switch>
      </Router> 
    </div>
  );
};

export default MainWrapper;

这是我的简单代码。当我去浏览器并手动输入http://localhost:8080/i时,路径没有改变。只有 http://localhost:8080/有效。http://localhost:8080/main-frame都 不起作用。以上都给出了错误:

Cannot GET /i
Cannot GET /main-frame

标签: reactjsreact-router

解决方案


我认为你必须修复它

<Router>      
  <Switch>
    <Route path="/main-frame" component={MainFrame} />
    <Route exact path="/" component={Login} />
    {/* <Route exact path="/i"> */}
  </Switch>
</Router> 

参考这个https://codeburst.io/getting-started-with-react-router-5c978f70df91


推荐阅读