【问题标题】:Have all Routes use basename subdirectory, except for one Route?是否所有路由都使用 basename 子目录,除了一个路由?
【发布时间】:2019-07-04 12:07:42
【问题描述】:

我的 react 应用程序正在集成到一个已经存在的 Maven 项目中,并且需要有一个 /my 的子目录。

所以所有Route 都需要拥有/my/~~~basename。但是,有一个路由不需要子目录,如果应用,点击该路由会导致无限循环。

具体路线是/logout。所以点击/my/logout 会导致无限循环。

项目中只有一个引用链接到 logout Route 和 Link

<Link to={"/logout"}>Logout</Link>

下面是我的App.js 和我的&lt;Router&gt;

const App = () => {
  return (
    <div className="App">
      <Router basename="/my/">
        <Switch>
          <Route path="/login" component={Login} />
          <Route exact path={"/"} component={Login} />
          <Route path="/forgotpassword" component={ForgotPassword} />
          <Route
            path="/website-user/reset-password/:token/:userId"
            component={ResetPassword}
          />
          <Route
            path="/complete-registration/:token/:userId"
            component={FinishRegistration}
          />
          <Route path={"/register"} component={Login} />
          <Route
            path="/register?email=:email&telephone=:telephone"
            component={Login}
          />
          <Route path={"/"} component={SubNav} />
        </Switch>
        <Route path={"/overview"} component={Overview} />
        <Route path={"/favourites"} component={Favourites} />
        {/* How to get LogoutComponent to go to /logout instead of /my/logout */}
        <Route path={"/logout"} component={Logout} />
      </Router>
    </div>
  );
};

所以可以让所有&lt;Route&gt; 转到/my/~~~,除了LogOut 转到/logout

任何帮助将不胜感激。

【问题讨论】:

    标签: javascript reactjs react-router react-router-dom


    【解决方案1】:

    不行。你不能这样做。

    页面上不应有多个BrowserRouters

    无论如何这都行不通,因为它正在与最近的路由器祖先对话。一旦你包装了另一个路由器,你就创建了一个新的历史实例,因此创建了一个完整的路由和链接子集。

    一种解决方法是,不要为logout 创建route,而是在您拥有logout 按钮的同一组件中使用onClick 函数来处理您的logout 功能。

    【讨论】:

    • 谢谢。这就是我的想法,在文档中看不到任何解决方法
    猜你喜欢
    • 2020-08-26
    • 2013-08-26
    • 2014-03-07
    • 2014-07-31
    • 2014-12-18
    • 2018-02-14
    • 2015-01-19
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多