Как я могу использовать реагировать маршрутизатор с пути больше, чем на / (без параметров)

Question

Я пытаюсь использовать реагирующий маршрутизатор, используя составной путь (например: / demo / common). Общее это не парам. Я хотел бы иметь что-то вроде этого:

    <Route
       exact
       path="/demo/page1"
       component={Page1}
    />

    <Route
       exact
       path="/demo/page2"
       component={Page2}
    />

Но когда я пытаюсь получить доступ к любому из этих маршрутов, он просто покажет мне белый экран.

Спасибо.

Answer 1

1. Добавьте родительский маршрут с path="/demo" и родительский компонент с именем ParentPage:

<Route path="/demo" component={ParentPage} />

Обратите внимание, что родительский маршрут не должен иметь exact prop , для выполнения вложенного поведения.

При ParentPage у вас будут Page1 и Page2 как дети:

<ParentPage>
 <Route
   path="/demo/page1"
   component={Page1}
 />
 <Route
   path="/demo/page2"
   component={Page2}
 />
</ParentPage>

Не имеет значения, имеет ли дочерний компонент exact опору или нет.