Reactjs 在嵌套中不工作

我用react路由器制作了嵌套路由器

我想进入登录页面，何时成功完成注册

但是，路由器没有工作。我该怎么办呢。谢谢你的帮助

//StepTwoComponent.tsx
注册（事件：FormEvent）{
userService.signup（this.props.signup）.subscribe（（res:any）=>{
如果（res.result==='success'）{
this.props.history.push（'/login'）；
}否则{
警报（res.msg）；
}
});
event.preventDefault（）；
}

---

问题是您多次使用

BrowserRouter

，只能在

index.tsx

文件中或根据您的结构在应用程序包装组件中使用一次

index.tsx

文件：

ReactDOM.render(
    <BrowserRouter>
        <App />
    </BrowserRouter>,
    document.getElementById('root') as HTMLElement
);

ReactDOM.render(
,
document.getElementById（'root'）作为HTMLElement
);

---

并从所有其他组件中删除

BrowserRouter

。

您只需在顶层使用BrowserRouter，而不是在每个子组件中，将其从SignUp.tsx中删除。另外，

Signup.tsx

中不需要开关，因为没有路径重叠。开关基本上用于渲染第一个路径匹配，并且当没有路径重叠时，只渲染匹配的路径

App.tsx

<BrowserRouter>
  <Switch>
    <Redirect exact={true} from="/" to="/login" />
    <Route path="/login" component={LoginComponent} />
    <Route path="/sign-up" component={SignUpComponent} />
    <Route component={LoginComponent} />
  </Switch>
</BrowserRouter>

 <div>
      <Redirect exact={true} from="/sign-up" to="/sign-up/1" />
      <Route path="/sign-up/1" component={StepOneComponent} />
      <Route path="/sign-up/2" component={StepTwoComponent} />
  </div>

注册。tsx

<BrowserRouter>
  <Switch>
    <Redirect exact={true} from="/" to="/login" />
    <Route path="/login" component={LoginComponent} />
    <Route path="/sign-up" component={SignUpComponent} />
    <Route component={LoginComponent} />
  </Switch>
</BrowserRouter>

 <div>
      <Redirect exact={true} from="/sign-up" to="/sign-up/1" />
      <Route path="/sign-up/1" component={StepOneComponent} />
      <Route path="/sign-up/2" component={StepTwoComponent} />
  </div>

在包装器组件中，在index.js文件中或根据您的结构，仅使用一次

BrowserRouter

。谢谢。我在

Signup.tsx

中删除了

BrowserRouter

。还有这个工作！如果我删除，则没有从“/sign-up”重定向到“/sign-up/1”。我不需要/注册页面。@Jong HyenKim您是否仅从注册组件中删除了开关？是的，我仅在注册组件中删除开关。我是否全部删除？