Как организовать дополнительный роутер в компоненте react.js?

Question

[Марат Иванов]

родительский компонент

<Provider store={store}>
    <Router history={createBrowserHistory()}>
      <ScrollToTop>
        <Suspense fallback={<LoadingComponent />}>
          <Switch>
            <Route exact path="/" component={Home} />
            <Route
              exact
              path="/repositories/access"
              component={RepositoriesAccess}
            />
            <Route exact path="/dashboards" component={Dashb} />
            <Route path="/services" component={Serv} />
            <Route exact path="/login" component={Log} />
            <Route component={NotFound} />
          </Switch>
        </Suspense>
      </ScrollToTop>
    </Router>
  </Provider>

дочерний вложенный компонент Dashb

<Router history={createBrowserHistory()}>
        <Switch>
            <Route path="/dashboards/component" component={component} />
            <Route path="/dashboards/component1" component={component1} />
            <Route exact path="/dashboards/component2" component={component2} />
            <Route exact path="/dashboards/componen3" component={component3} />
            <Route exact path="/dashboards/component4" component={component4} />
            <Route exact path="/dashboards/component5"={component5} />
            <Route exact path="/dashboards/web6"={component6} />
            <Route exact path="/dashboards/release7"={component7} />
        </Switch>
    </Router>

Спасибо!!

Comments

[Марат Иванов]

не работает вышеуказанная конструкция)) но урл меняется исправно, а отображения компонентов нет

Answer 1

[0xD34F]

Уберите дополнительный Router.

Вместо path="/dashboards/component" лучше писать path={`${props.match.url}/component`}.