基于条件的路由重定向：React JS

Question

我正在开发一个基本上有两个流程的应用程序，分别是“ FLOW1”和“ FLOW2”。有对应于每个流的路由。现在，我维护了一个开关，可以在流之间进行切换，并且相应地，页面也应该重定向。

例如：

FLOW1具有以下路由及其对应的组件：

F1R1：pageF1R1，

F1R2：pageF1R2，

F1R3：pageF1R3

FLOW2具有以下路由及其对应的组件：

F2R1：pageF2R1，

F2R2：pageF2R2，

F2R3：pageF2R3

这些路径是彼此相对的部分，每当我更改配置文件时，与更改后的流程相对应的路径就应该更改。

所以我已经尝试过类似的事情，如果它有很多。有没有更好的方法可以实现？

逻辑

 navigate = (event) =>
 {
     let currentUrl = this.props.history.location.pathname;
     let flow = event.target.name;
     if(flow === "FLOW1")
     {
        if(currentUrl === "/F2R1")
          this.props.history.push("/pageF1R1");
        if(currentUrl === "/F2R2")
          this.props.history.push("/pageF1R2");
        if(currentUrl === "/F2R3")
          this.props.history.push("/pageF1R3");
     }
     if(flow === "FLOW2")
     {
        if(currentUrl === "/F1R1")
          this.props.history.push("/pageF2R1");
        if(currentUrl === "/F1R2")
          this.props.history.push("/pageF2R2");
        if(currentUrl === "/F1R3")
          this.props.history.push("/pageF2R3");
     }
 }

我正在开发一个基本上有两个流程的应用程序，分别是“ FLOW1”和“ FLOW2”。有对应于每个流的路由。现在，我维护了一个开关，可以切换...

Answer 1

您可以使用react-router-dom解决您的问题，这是基于您的想法的我的代码