react-router - 中のルートを決める条件に基づいてレンダリングする

Question

useraと aの 2 種類のルートがありprojectます。userルートは最上位の URL リソースですがproject、user. 例:/users/1/fooと/users/1/projects/2/bar.

ルートに が含まれていない場合にのみユーザー ルートに固有のコンポーネントを表示し、含まれている場合は/projects/:idプロジェクト固有のコンポーネントを表示したいと考えています。

以下を試すと、どちらの場合も/users/:idルートがロードされます。

<Switch>
  <Route path="/users/:id" component={...} />
  <Route path="/users/:id/projects/:projectId" component={...} />
</Switch>

<Switch>
  <Route path="/users/:id/projects/:projectId" component={...} />
  <Route path="/users/:id" component={...} />
</Switch>

通常、これは、いずれかのコンポーネントを示す条件付きのコンポーネントを使用することで非常に簡単に実現できますが、私の要件は、ユーザー固有およびプロジェクト固有のコンポーネントを動的にロードすることです (インポートは自動的に処理されwebpackますreact-loadable)。ルートレベルのソリューション、またはreact-loadable.

編集 問題は、ルートに間違ったパスを指定していたことです。より具体的な ( project) ルートを最初に<Switch />